Whitestorm.jsで3D Webアプリとグラフィックを作成する
Webゲーム おかげで長い道のりを WebGL そして 関連HTML5 API. 3D用の最も有名なオープンソースライブラリは Three.js.
Three.jsは強力ですが、同時に 最初から学ぶのは複雑. 代わりに、できます Whitestorm.jsを拾う, 3D Webグラフィック用に作られたオープンソースフレームワーク。それ Three.jsを使用します より速く構築し、ブラウザでリアルな3D効果を作成するための基盤となるテクノロジとして.
Whitestormには 独自の物理エンジン Three.jsレンダリングの上に構築されています。これにより、オブジェクトに現実的な重力やその他の同様の効果を作成できます。 相互作用し、互いに反応する.
そしてホワイトストームは 完全モジュラー, そのため、どの機能をページにロードするかを完全に制御できます。それを使用します 弾丸物理ライブラリ のJavaScriptに移植された Web上でフルサポート.
これが基本的なコードの断片です。 新しいThree.js環境を作成します Whitestormを使う.
const app = new WHS.App([new WHS.app.ElementModule()、// DOMにアタッチするnew WHS.app.SceneModule()、// THREE.Sceneインスタンスを作成するnew WHS.app.CameraModule()、// PerspectiveCameraインスタンスを作成します。new WHS.app.RenderingModule()// WebGLRendererインスタンスを作成します。 app.start(); //アニメーションを実行
あなたは自然にできる あなた自身のモジュールを追加する そしてさらに プラグイン/コンポーネントを作成する デフォルトライブラリを構築した。 JSコード ECMAScript 6をサポート そして言語へのすべての今後の変更をサポートするべきです.
ジオメトリ, 物理, そして モーション すべてが1つのライブラリにまとめられました。ホワイトストームは本当にWebの3Dアニメーションの未来です.
発見できる たくさんのサンプルコード GitHubレポジトリに ダウンロードリンク そして ファイルブラウザ. 図書館に警告される 巨大 それで、通過することがたくさんあります。ドキュメンテーションでさえ 長いチュートリアル 初心者向け.
しかし、それらのドキュメントを使えば、からすべてを学ぶことができます。 3D変換 に デバッグと詳細な3Dアニメーション.
詳細については、メインサイトにアクセスして、いくつかの実際の例を参照してください。 ホワイトストームの動作を見る. あなたがダイビングするのに十分大胆であれば、それから図書館のコピーをダウンロードしてください GitHubから または npm経由 そして素敵な3D Webアプリの作成を始めましょう.