Question

我正在使用raphael来做一些SVG动画，但似乎无法获得功能animateAlong to work。我继续得到错误“attrs [0]未定义”引用未压缩的raphael代码的第3450行。

基本上，我创建一个具有给定中心的圆，然后想要围绕该路径设置动画。这是一个简单的代码：

var circle = paper.circle(circleCenterX, circleCenterY, circleRadius);

然后我克隆一张图片（因为我打算在这条路径上有很多这样的图片）并放在圆圈的边缘：

var wheelClone = wheel.clone();
var wheelRadius = parseInt(wheel8ImageWidth/2);
wheelClone
.translate((circleCenterX + circleRadius)-3, circleCenterY-wheelRadius);

我之前使用circleCenterX = circle.attr（cx）;

初始化circleCenterX

这一切都正常，图像放置正确 - 但它在animateAlong上出错。

我已经研究了尽可能多的例子，我已经找到并解剖了文档但是无法在这里解决。

所以，我只是试着调用这个函数，但是没有人真正意识到文档所指的是什么。文档在路径周围设置了一个点，但是引用了两个变量 - rx和ry，我无法理解这些变量 - 无论是在init函数中还是在回调函数中。

这就是我所拥有的 - - rx和ry所在的地方，因为我不知道他们所指的是什么。

 var wheelAttr = {
  rx: 5,
  ry: 3
 };

 wheelClone.attr(wheelAttr).animateAlong(circle, 2000, true, function() {
  wheel.attr({rx: 4, ry: 4});
 });

我目前的jsFiddle现在有点乱，我可以清理它，但我怀疑这里有一些明显的东西？

感谢所有

取值

Answer 1

我不认为圆圈实际上是一个有效的路径（即，你可以传递给animateAlong（）的东西）。我认为你需要创建一个循环的路径。请参阅以下内容：

svg-animation-along-path-with-raphael

希望它会有所帮助。

raphael问题 - 使用animateAlong

1 个答案: