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