如何为“拉斐尔”画布制作动画？答案

【问题标题】：How to animate 'Raphael' canvas?如何为“拉斐尔”画布制作动画？
【发布时间】：2011-03-09 13:15:46
【问题描述】：

我正在使用 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”。

这里发生了什么，我该如何解决？

【问题讨论】：

【解决方案1】：

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

【讨论】：

【解决方案2】：

你的右括号顺序是错误的

改变

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

到

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

更新

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

【讨论】：

【解决方案3】：

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

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

【讨论】：