0

使用 Raphael.js,我制作了一个圆和一条路径,我想做的就是让圆单独为路径设置动画,就好像圆的中心沿着这条线走一样。

http://jsfiddle.net/rEJNJ/3/

谁能提供一些建议

window.onload = function () {
            var paper = Raphael("canvas", 640, 480);
            var c = paper.circle(90, 90, 40);
                c.attr({fill: "blue"});
            var p = paper.path("M150,380 C150,360 50,250 220,90").attr({stroke: "#ff0000"});

            c.animateAlong(p, 4000, true);
        };
4

1 回答 1

0

如果您使用与路径开头相同的 X/Y 坐标创建圆圈,则动画将起作用:

http://jsfiddle.net/rEJNJ/4/

window.onload = function () {
    var paper = Raphael("canvas", 640, 480);
    var c = paper.circle(150, 380, 40).attr({fill: "blue"});
    var p = paper.path("M150,380 C150,360 50,250 220,90").attr({stroke: "#ff0000"});
    c.animateAlong(p, 4000, true);
};

看看这篇文章,了解原因:SVG animation along path with Raphael

于 2011-09-28T00:29:44.370 回答