raphael - ラファエルの点から画像を回転させる

Question

あるポイントから回転させたい画像があります。画像のサイズは 100px x 100px です。

画像内から特定のポイントを中心に回転させたい。コンパスを考えてみてください。回転させたいポイントは、針がある場所です。したがって、私の例では、画像内から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を使用する必要があります