Bonjour,
Je travaille sur la génération de SVG par du script.
je veut créer un rectangle avec une largeur dynamique selon la longueur d'un texte qui doit être positionné dans ce rectangle, pour se faire j'ai écrit ce scripte de test :
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
 
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html>
  <head>
    <title>Test</title>
  </head>
  <body>
	  <table border="0">
	  	<tr>
	  		<td><input id="txt1" type="text"/></td><td><input type="button" value="Ok" onclick="createRecText(evt)"/></td>
	  	</tr>
	  </table>
  <svg xmlns="http://www.w3.org/2000/svg"  id="svgNode" width="730" height="550" onload="createRecText(evt)" >
	  <script type="text/javaScript">
	  	<![CDATA[
	  		function createRecText(evt){
		  	var doc=evt.target.ownerDocument;
		  	var textInput=doc.getElementById("txt1").value;
		  	//création du rectangle
		  	var rect = doc.createElementNS("http://www.w3.org/2000/svg","rect");
			rect.setAttributeNS(null,"x","30");
			rect.setAttributeNS(null,"y","100");
			rect.setAttributeNS(null,"width",(textInput.getComputedTextLength()+50).toString());
			rect.setAttributeNS(null,"height","120");
 
		  	//création du texte
		  	var txtSvgNode = doc.createElementNS("http://www.w3.org/2000/svg","text");
			txtSvgNode.setAttributeNS(null,"x","50");
			txtSvgNode.setAttributeNS(null,"y","120");
			txtSvgNode.nodeValue=textInput;
			svgNode=doc.getElementById("svgNode");
			svgNode.appendChild(rect);
			svgNode.appendChild(txtSvgNode);			
	  	} 
	  	]]>
	  </script>
  </svg>
  </body>
</html>
Le problème c'est qu'il ne génère ni texte, ni rectangle
de l'aide SVP.