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 41 42
   |  
<script>
function OnDragStart (target, evt){
   evt.dataTransfer.setData("IdElement", target.id);
}
function OnDropTarget (target, evt) {
   var id = evt.dataTransfer.getData("IdElement");
   target.appendChild(document.getElementById(id));
   evt.preventDefault();
}
 
function creer_svg(nmchb,x,y){
 
		//On definie ou le svg devra apparaitre
        var cont=document.getElementById("svgContainer")
        var rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
        //On donne l'id du rect
        rect.setAttribute("id", nmchb); 
        //On donne la couleur du rect
        rect.setAttribute("fill","red");
        //On donne l'opacité du rect
        rect.setAttribute('opacity',"0.5")
        //On donne la couleur de la bordure au rect
        rect.setAttribute("stroke","black");
        //On donne la largeur de la bordure du rect
        rect.setAttribute("stroke-width","1");
        //On donne la position x dans svgContainer du rect
        rect.setAttribute("x", x);
        //On donne la position y dans svgContainer du rect
        rect.setAttribute("y", y);
        //On donne la largeur au rectangle
        rect.setAttribute("width", "150");
        //On donne la longueur au rectangle
        rect.setAttribute("height", "100");  
        //On rend le svg(rect) dropable
 
 
        //On défini que rect est un enfant de svg
        svg.appendChild(rect);
		cont.appendChild(svg);
}
</script> | 
Partager