javascript - 如何为“拉斐尔”画布制作动画？

Question

我正在使用 Raphael 库来创建 SVG 对象。

为了初始化 SVG 形状并为里面的所有东西创建一个画布，我使用了文档中所述的以下行：

var paper = Raphael(10, 50, 320, 200);

我现在想为纸张和其中的所有内容设置动画，就像我要为已按以下方式附加到纸张的形状设置动画一样：

var firstShape = paper.rect(x, y, width, height);
firstShape.animate({x: 100}, 500, "<");

当我尝试与纸张类似的东西时，例如：

paper.animate({x: 100}, 500, "<");

我得到错误' paper.animate is not a function'。

这里发生了什么，我该如何绕过它？

score 9 · Accepted Answer

您不能为纸质对象设置动画。纸没有动画的属性。但是您可以将所有元素合并到集合中，然后对其进行动画处理。

score 3 · Accepted Answer

您的右括号顺序错误

改变

paper.animate({x: 100, 500, "<")};

到

paper.animate({x: 100}, 500, "<");

更新

从文档中，似乎animate不能直接在上调用paper，而只能在从画布上切出的子形状上调用 - 这就是firstshape.animate有效的原因

score 0 · Accepted Answer

你不能为绘图板设置动画......只有它里面的形状......

纸是你的绘图板.. 而 firstShape 是在板内创建的形状..

3 回答 3