2012-07-12 8 views
26

WebGLへのインターフェースとしてThreeJSをよく学習しています。以前の助けをありがとうございました。THREE JSに対応するTWO JSにはありますか

私は3Dダイナミクスへの新しいアプローチを開発していますし、教科書に3Dコンポーネントをしたいと思います。例はここにあり:http://eon.sdsu.edu/~impellus/DMF/

彼らは最高ではありませんが、私は勉強しています。

は並行して、私は2Dの静と2D INTERACTIVEフリーボディダイアグラムでいくつかのアニメーションを調査したいと思います。目標は、オブジェクトを提示し、その側面をスライスし、破棄したセクションを強制的に置き換えることです(基本的には、連絡先を削除して対話的に自由体図を構築することです)。通常、私はフラッシュを考慮するが、私はそれに反対してアドバイスを受けている。

あなたは、私は流線、流脈線、パスライン上の2Dのチュートリアルを作成するためにthreejsを使用したことをここで見ることができます。

http://eon.sdsu.edu/~impellus/FLOW/

しかし、私の気持ちは、2DのためthreeJSの電源を使用するのが自然ではないということですインタラクティブなアニメーション。

Three JSバージョンのThree JSバージョンがあるかどうか尋ねることができますか?私は質問が私が探しているものの証拠でなければならないと思うが、もっと明確にする。私は2Dアニメーションに特化したwebGLへのインターフェイスを探しています。はい、私はthreeJSを使うことができますが、それは間違いだと思います。誰かが私を導くことができますか?

答えて

9

のように、ただThree.js使用最後に、2D HTML5のアニメーションを描画するための商用製品があります。 Z方向に決して移動しないようにカメラを設定し、すべての視覚的要素を同じz =一定面に配置すると、2Dエンジンになります。あなたが対処しなければならない

唯一のことは、平面上の要素のzオーダーです。これは、各要素にわずかに異なるZ値を割り当てる方法です。

たとえば、Z = 0平面に描画する場合、要素1をZ = 0で描画し、要素2をZ = 0.0001なので、要素2は常に要素1の上に描画されます。

z順序を実現するより良い方法は、エンジンをハックし、1つの要素を強制的に描画するために各要素の描画順序を設定することです別の前に。

またthree.jsを使用して別の問題は、(執筆時点で)、それは非常によく、2Dスプライトを処理しないということです。

28

pixi.jsは最近リリースされた - それは、パフォーマンスのためのWebGLに裏打ちされた2Dエンジンですが、互換性のために、2Dキャンバスフォールバック。私は自分で使ったことはありませんが、チェックアウトする価値はあります。

+6

APIもthree.jsに非常に触発されているようです。 – mrdoob

+0

ivank.jsがより完全で、webgl(カンバスまたはDomにフォールバック)も使用しています。今すぐテストしており、イベント(クリック、ドラッグ)とベクターがたくさんあります。より完全なようです。 –

+0

もう1つの2Dキャンバスゲーム/アプリエンジンですが、これは明らかにリリースされたばかりですが、(非常に)素早く見て、使いやすくて使いやすいと思われます: – poshaughnessy

5

私はIvanKがかなり速い発見し、それがPixijsよりたくさんより多くの機能を持って完了しています。

(それはwebgl、canvas、svgレンダラーに自動フォールバックサポートがあります)。

http://lib.ivank.net/?p=demos

私は別のライブラリ、fabricjs.com、非常に強力で遅いを発見しました。

関連する問題