javascript - 在 RaphaelJS 中通过路径将图像“绘画”动画到纸上

Question

我正在寻找通过圆形“画笔”[Think Photoshop 默认画笔]将图像动画到画布上，无论圆圈在图像显示的路径上移动。

图像将是位图，而不是矢量文件。除了显示图像的“绘画”之外，画笔不会有任何额外的细节

作为补充说明，圆形画笔会自动移动，用户不会移动画笔。它只是沿着路径动画。

我真的很想知道如何用 Raphael 做到这一点。

提前致谢！

Answer 1

如果你想实现这样的目标，你最好考虑使用Canvas. 因为Raphael是一个专门面向SVG. 您可以使用非 svg 图像，但您将面临很多限制。

另一方面，Canvas 是面向像素的，所以你想做的事情会更容易。

Raphael在用户交互方面非常棒SVG，因为您创建的元素是 DOM 中的节点，您可以轻松地将它们绑定到事件。

如果您仍然想用 实现类似的目标Raphael，您将需要开始深入研究 Raphael 的方法。很难有人解释整个过程。你最好开始尝试，并就更具体的问题提出一些问题。

除了 Raphael 的文档，我推荐这个色彩丰富但很有用的网站，其中有一些工作示例。

无论哪种方式，我认为您应该重新考虑使用Raphaleover Canvas！

我希望这有帮助！