ianime.js: iPhoneのCanvasにVector 描画させてみる
2007.11.14
英語ブログの方に昨日書いたのだが、ianime.jsにベクターでのアニメーションをサポートする機能を付け加えた。SVGのようにタグでシェイプを記述できないので、コールバック・ファンクションの形で記述する。
Firefox/Safari/Operaがサポートし、業界標準になりつつあるCanvasに関しては誤解している人も多いようだが、ビットマップだけでなくベクター描画の機能が付いており、これを使えばFlashでしか実現できなかったことがブラウザー上のJavascriptで実現できる(その意味では、SVGともオーバーラップする部分がある点が少し問題だが、それに関しては別途書こうと思う)。
現時点で、FlashもSVGもサポートしていないiPhone/iPod touch上のブラウザーでベクター・グラフィックスを使おうと思ったら、これが唯一の選択肢。
下に貼付けたのはこれを使って「蝶」を飛ばせるデモ(Firefox/Safariで動作確認済み。Operaは未確認。IEはサポート外)。いずれかのアイコンをクリックすると、そこから蝶が飛び立つ。何匹でも同時に飛ばすことができるので、これを使ってiPhoneのベクター描画能力を測定。10匹ぐらいは何の問題もない。iPhone/iPod touchで試したい人は、下のURLで。
Comments