Three.js Javascript/WebGL 3D グラフィックライブラリ

投稿日: 12月 22, 2014

私は長い間、3D グラフィックスに興味を持っていました。その興味は 3D ゲームから始まりました。昔、3dfx グラフィックスカードが普及していた頃、Windows ベースの OS でハードウェアアクセラレーションされた 3D グラフィックスが実現できるものを垣間見ました。

それ以来、ハードウェアメーカーは、より高性能なハードウェアを製造するという使命に取り組んできました。Html5 とWebGLの登場により、Web 環境で複雑な 3D グラフィックスを体験できるようになりました。

ブラウザで 3D を生成できるブラウザプラグイン (Flash Shockwave、Silverlight、Java) は確かに存在していますが、さまざまなブラウザやプラットフォーム (iOS が主流) でのサポートはまちまちです。

WebGLが Web 標準として採用されるようになってから (そう、最近 iOS 8 にも追加されました! )、Web ブラウザで複雑な 3D を生成する手段がようやく手に入りました。これで、Web が 3 次元に進化する可能性がようやく開けたと思います。

WebGL のサポートが拡大する中、私たちは最高の WebGL グラフィックライブラリの 1 つを調べてみました。3.js のここでは、私たちが見つけることができる最高のthree.jsデモをいくつか見てみましょう。

1. サムスンレーサー

これは、1 台の F1 カーがレースをしている様子を示すフォーミュラ 1 レーシングカーのデモです。車をクリックすると、カメラの角度が変わります。

デモを見ることができますここ。

グラフィックが音楽に合わせて踊る様子をご覧ください。マウスを使用してメインライトの方向を制御します。

デモを見ることができますここ。

これは小さなゲーム/デモです。キャラクターを操作して、3D の世界を飛び回ることができます。

デモを見ることができますここ。

こちらは、近日公開予定の映画「ダイバージェントシリーズ」の予告編を視聴できるインタラクティブな Web サイトです。

デモを見ることができますここ。

ドローンの目を通して無限の都市を飛行します。

デモを見ることができますここ。

WebGL デモや WebGL を使用したクールな Web サイトを作成した場合は、ぜひお知らせください。