跟踪直线移动的圆的位置

时间:2016-11-04 06:54:34

标签: javascript svg position

圆圈沿着一条线移动。我需要找到它的x和y坐标,并在圆圈到达所需位置时执行一些任务。所有SVG元素都是动态创建的,并且放在同一个SVG标记中。我找到了一个similar question,但我无法遵循它。有没有更简单的方法来获得它的x和y位置?

function RunTrain(x,y,desti,dur,r,begin)
 {
    var xmlns="http://www.w3.org/2000/svg";
    var C=document.createElementNS(xmlns,"circle");
    C.setAttributeNS(null,"cx",x);
    C.setAttributeNS(null,"cy",y);
    C.setAttributeNS(null,"r",r);
    C.setAttribute("style","stroke-width:1;stroke:blue;fill:skyblue");

    var animate=document.createElementNS(xmlns,"animate");
    animate.setAttribute("attributeName","cx");
    animate.setAttribute("attributeType","XML");
    animate.setAttribute("from",x);
    animate.setAttribute("to",desti);
    animate.setAttribute("dur",dur);
    animate.setAttribute("begin","indefinite");
    animate.setAttribute("repeatCount","1");
    animate.setAttribute("fill","freeze");

    C.appendChild(animate);
    document.getElementById("id1").appendChild(C);//id1 is id of svg
    animate.beginElement();
 }

0 个答案:

没有答案