RaphaelJSローテーションが動作しない

Question

私はこのヘッドで壁に頭を打っています。私は、ラプラスjsバージョン2.0を持っていると私はクロスブラウザのように画像を回転させる必要があります。私はCSS3でそれをやりたいですが、すべてのブラウザが私がする必要があるものをサポートするわけではありません。

私の脳を擦った後、私はラファエルの遊び場に行き、そこでいくつかのコードを試しました。そこではうまくいきません。何が起きてる？

遊び場に行く：http://raphaeljs.com/playground.html このコードを実行すると、正方形の概要が表示されます。 paper.rect（100,100,300,300）。アニメート（{rotation： " - 45"}、2000）;

paper.rect（100、100、300,300）.animate：作品変換を用い

（{変換： "R45"}、2000）。

しかし、残念ながらトランスフォームでは、中心点を指定できないようです。オブジェクトを左下隅から回転させたい。私はこのコードでそれを行うことができます。

paper.rect（100、100、300300）.rotate（45,0,300）

それがアニメーション化、または緩和受け入れる、または任意のコールバックを持っていません。私はこれらを含むいくつかの例では、 "回転" を見てきました

：

http://www.irunmywebsite.com/raphael/additionalhelp.php#PAGETOP http://net.tutsplus.com/tutorials/javascript-ajax/an-introduction-to-the-raphael-js-library/

おかげで、 - キース

Answer 1

回転属性は、2.0仕様から欠落しているように見えます。それは1.xに存在した。私はなぜこれがそうであるのかわかりませんが、私は新しいドキュメントでそれを見つけることができません。私はこれが今後のマイナーリビジョンで修正される見通しだと思っています。

あなた自身のアニメーションハンドラを作成し、自分のイージングに基づいて各ティックで.rotateを呼び出すことができます。

Answer 2

playground siteに移動し、このコードを貼り付ける：

paper.rect(100, 100, 300,300).animate({transform:"r-45,0,0"}, 2000); 

絶対0,0位置から矩形を回転させます。 raphael js code @githubを参照してください。これは、transformが回転を達成するために2つまたは4つのパラメータを取ることができることを示しています。