raphael - 从 Raphael 中的一个点旋转图像

Question

我有一张想要从某个点旋转的图像。图像大小为 100 像素 x 100 像素。

我想在图像内的某个点附近旋转它。想想指南针。我想要旋转它的点就是针所在的位置。因此，在我的示例中，我想将图像从图像中的左上方 80px 处旋转 80px 点。这是可能的还是我必须创建某种 gif。

Answer 1

这是一个例子 http://jsfiddle.net/KtB3G/1/

<div id="container"> 
    <img id="img" src="http://upload.wikimedia.org/wikipedia/commons/thumb/e/e0/Rectangle_example.svg/220px-Rectangle_example.svg.png"> 
</div> 

<script>
    $(function() {
        var src = $("#img").attr("src");
        $("#container").html("");
        var paper = Raphael($("#container")[0], 500, 500);

        var image = paper.image(src, 0, 0, 220, 130);

         $("#container").click(function() {
            image.animate({
                transform: "r360t50,50"
            }, 1000, ">");
        });
    });
</script>

您可以使用变换来实现所需的结果http://raphaeljs.com/reference.html#Element.transform

编辑：为了使它工作，你必须使用 Raphael 2