[VML] cr�er un element v:textbox par JavaScript

**loacast** · 20/11/2010, 17h44

Salut,

J'essaye en vain de cr�er dynamiquement par JavaScript un texte dans une page VML.
La communaut� VML �tant pauvre, les ressources sur Internet le sont aussi, donc me voil� ^^

J'ai r�aliser un exemple tout sp�cialement pour cette question, vous pourrez �ventuellement tester sur votre ordi si le coeur vous en dit

.

textbox.html :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
 
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<script src="textbox.js" type="text/javascript"></script>
 
	<link rel="stylesheet" href="css/style.css" type="text/css" />  
	<title>Test ajout element textbox pour VML</title>
 
</head>
 
<body onload="loadVML();">
 
	<div id="ma_div" style="max-width: 400px; width: 400px; max-height: 300px; height: 300px; background-color: #000; overflow: hidden;" ></div>
 
</body>
</html>

textbox.js :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
 
function loadVML() {
 
		// Init VML
	document.namespaces.add( "v" , "urn:schemas-microsoft-com:vml" );
	vmlStyleSheet = document.createStyleSheet();
	vmlStyleSheet.cssText = "v\\:* {behavior:url(#default#VML);display:inline-block;}";
 
		// Insertion d'un élément VML dans une div HTML
	viewVML = document.createElement( 'v:group' );
	elementDiv = document.getElementById( 'ma_div' );
 
	viewVML.style.width = 400;
	viewVML.style.height = 300;
	viewVML.coordorigin = '0,0';
	viewVML.coordsize = '400,300';
	elementDiv.appendChild( viewVML );
 
		// Insertion d'un rectangle dans l'élément VML
	elementRect = document.createElement( 'v:rect' );
 
	elementRect.style.position = 'relative';
	elementRect.style.left = 100;
	elementRect.style.top = 200;
	elementRect.style.width = 150;
	elementRect.style.height = 50;
 
	elementRect.fillcolor = 'rgb(255,165,0)';
	viewVML.appendChild( elementRect );
 
		// Insertion d'un texte dans l'élément VML
		// C'est ce code qui ne fonctionne pas
	elementText = document.createElement( "v:textbox" );
 
	elementText.style.left = 100;
	elementText.style.top = 100;
	elementText.appendChild( document.createTextNode( "test" ) );
 
	viewVML.appendChild( elementText );
}

Probl�matique, le rectangle s'affiche, mais pas le texte.

Vous remerciant � l'avance de l'aide que vous pourrez m'apporter.

Note : Le VML ne fonctionne que sous Internet Explorer alors ne testez pas sous firefox.

EDIT : r�solu ^^

Il fallait contenir le v:textbox dans un v:shape.

**sekaijin** · 20/11/2010, 21h52

VML est un format propre � Microsoft qui n'est impl�ment� que par IE donc pas portable
la doc est tr�s compl�te sur MSDN comme pour tout les produits Microsoft.

par contre pour faire la m�me chose de fa�on plus large il y a SVG qui reprend du poil de la b�te.

mais lui n'est pas support� par IE (enfin dans la derni�re version il arrive)

mais il y a un petit nouveau qui peut int�resser tout le monde
http://raphaeljs.com/
ce jeune projet d�j� inclus dans diverses lib comme jQuery et Extjs offre une API simplifi� pour cr�er en javascript des dessins et animations

ce qui est int�ressant c'est que rapha�l utilise SVG ou VML suivant la plate-forme

A+JYT

**loacast** · 22/12/2010, 10h14

VML est un format propre � Microsoft qui n'est impl�ment� que par IE donc pas portable
la doc est tr�s compl�te sur MSDN comme pour tout les produits Microsoft.

Merci pour ta r�ponse !

Je l'ai parcouru et le moins qu'on puisse dire c'est qu'il y a beaucoup d'articles pour ne rien dire ... m�me si msdn m'a tout de m�me aid� sur de nombreux points.

par contre pour faire la m�me chose de fa�on plus large il y a SVG qui reprend du poil de la b�te.

Je sais bien

ce jeune projet d�j� inclus dans diverses lib comme jQuery et Extjs offre une API simplifi� pour cr�er en javascript des dessins et animations

ce qui est int�ressant c'est que rapha�l utilise SVG ou VML suivant la plate-forme

C'est loin d'�tre le seul ! Les projets �quivalents sont nombreux. D'ailleurs j'en fais actuellement un avec le framework javascript prototype.js, cf ma signature.

[VML] cr�er un element v:textbox par JavaScript

JavaScript

Vue hybride

Discussions similaires

Partager

Partager