Bonjour,
j'essaie actuellement de faire une petite application de dessin en javascript+SVG.
Tout allait bien jusqu'au moment ou j'ai décidé de mettre une image de fond.
cette fonction me permet de creer mon elément svg.
ensuite pour faire par exemple un rond je fais ceci , qui fonctionne très bien.
pour une image :
a l'affichage cela fonctionne tres bien sauf que quand j'exporte mon code pour en faire un fichier .svg j'ai un soucis, ma balise image n'est pas fermée.
Y a t-il un moyen en javascript de fermer ma balise image?
Ou savez-vous pourquoi mes balises sont fermés et pas la balise image?
merci
j'essaie actuellement de faire une petite application de dessin en javascript+SVG.
Tout allait bien jusqu'au moment ou j'ai décidé de mettre une image de fond.
function creerSvgVide(sIdSubstitut, iLargeur, iHauteur) {
//Récupère le noeud élément (c'est-à-dire la référence vers la balise XHTML) qui sera remplacé par l'élément SVG
var oSubstitut = document.getElementById(sIdSubstitut);
//Créé un élément SVG avec une largeur et une hauteur
var oSvg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
oSvg.setAttribute("xmlns", "http://www.w3.org/2000/svg");
//oSvg.setAttribute("xml:space", "preserve");
oSvg.setAttribute("xmlns:xlink","http://www.w3.org/1999/xlink");
oSvg.setAttribute("width", iLargeur);
oSvg.setAttribute("height", iHauteur);
oSvg.setAttribute("version", "1.1");
//Place l'élément SVG dans la page XHTML à la place de l'élément substitut
oSubstitut.parentNode.replaceChild(oSvg, oSubstitut);
//Retourne la référence du SVG, afin de s'en servir avec l'autre fonction
return oSvg;
}
cette fonction me permet de creer mon elément svg.
ensuite pour faire par exemple un rond je fais ceci , qui fonctionne très bien.
var ellipse = document.createElementNS('http://www.w3.org/2000/svg', 'ellipse');
ellipse.setAttribute('cx', event.pageX);
ellipse.setAttribute('cy', event.pageY);
ellipse.setAttribute('rx', "5");
ellipse.setAttribute('ry', "5");
ellipse.setAttribute('style',"fill:"+$("#color1").val()+"; ");
obj.appendChild(ellipse);
pour une image :
var img = document.createElementNS('http://www.w3.org/2000/svg', 'image');
img.setAttribute('width', "340");
img.setAttribute('height', "193");
img.setAttribute('x', '0');
img.setAttribute('y', '0');
img.setAttributeNS('http://www.w3.org/1999/xlink', 'href', "http://basket.zen-creation.fr/images/terrain.png");
obj.appendChild(img);
a l'affichage cela fonctionne tres bien sauf que quand j'exporte mon code pour en faire un fichier .svg j'ai un soucis, ma balise image n'est pas fermée.
Y a t-il un moyen en javascript de fermer ma balise image?
Ou savez-vous pourquoi mes balises sont fermés et pas la balise image?
merci