enchant.jsの3D回転を拡張するプラグインSprite3d
以前の記事で、enchant.jsで回転軸を変えるのには成功したのですが、回転方向を変えるrotateXYZは上手く行きませんでした。
というのも、Spriteオブジェクトではレンダリングされるたびに、スタイルを書き換えているのですが、これのせいで別でスタイルを変えても上書きされてしまってたのです。
最初はSpriteのイベントリスナーを弄る予定だったのですが、無名関数で登録されていて、変更が困難だったので、新しくSprite3Dというクラスを作成しました。
【ダウンロード】
右クリックで名前を付けて保存で保存してください。
【使い方】
game.jsを読み込む前に
<script type="text/javascript" src="Sprite3d"></script>
で読み込んでください。
そして、game.js内で、new Sprite() の替わりにnew Sprite3d（）でスプライトを作成してください。
Spriteで使える機能は全て使えます。
【追加されたメソッド】
TransformOrigin(x,y)
回転する軸を指定します。xのみ指定した場合はxとyは同じ値になります。初期値は50% 50%です。
rotateX(deg)
rotateXの値を変更します。Ｘ軸を中心に回転します。
rotateＹ(deg)
rotateＹの値を変更します。Ｙ軸を中心に回転します。
rotateＺ(deg)
rotateＺの値を変更します。Ｚ軸を中心に回転します。
rotate2(deg)
deg度回転します。rotateと違うのは、360度を超えた場合は値が０になります。逆に０を下回った場合は360になります。
尚、rotateXYZは現在WebKit系ブラウザ(クロームとSafari)にのみ機能するように設定しています。
どうも色々試してみましたが、firefox4では動作しませんでした。このあたりの設定について詳しい情報があったら教えてください。