javascript - 如何使用 Raphaël 旋转普通图像？

Question

这可能是也可能不是一个非常微不足道的问题，但话又说回来，我对这个 JavaScript 库完全陌生（即今天才开始阅读它）。究竟如何使用 Raphaël 在我的服务器上旋转一个简单的图像（png/jpeg 等）？需要先转成SVG吗？换句话说，我需要在http://raphaeljs.com上复制这个演示

Answer 1

您可以将图像放在画布上并对其应用旋转变换。这是一个例子：

var paper = Raphael("thepaper", 300, 300);
var theImage = paper.image("http://i.stack.imgur.com/Zg08b.png", 0, 0, 128, 128);
theImage.transform("R45");

你可以在这里看到一个工作演示。

你可以很容易地通过应用动画来制作动画。将最后一行更改为：

theImage.animate({"transform": "R45"}, 10000);

你可以看到它在这里工作，它会在 10 秒内旋转 45 度。