three.js の紹介
- 6. 自己紹介 BearTail でエンジニア Dr.Wallet というアプリの開発 を手伝っている BearTail は優秀なエンジニアを 募集中
- 8. three.js とは three.js http://threejs.org/ JavaScript用の3DCGのライブラリ WebGL をラッパーしているので、GPUを利用できる WebGLRendererだけでなく、CanvasRenderer もあるので、WebGL が動作しない環境でも使える！
- 9. three.js とは MIT License (かなり寛容なライセンス) できること 商用利用 修正 配布 派生作品に別のライセンスを課すことなど
- 11. demo http://threejs.org/examples/ #webgl_animation_cloth 布にボールを投げたり風をあてたり できる 布のシュミレーションは ばねモデ ルで自力でやってるよう Geometry(形状) の動的な update 処理 Fog(霧) 効果
- 14. demo http://stemkoski.github.io/ Three.js/Reflection.html 鏡のように反射する Material とても綺麗！
- 16. 良い所 実際に使ってみての感想 WebGL (というか3DCG) の難しい部分を完全にライブラリ 任せでできる ソースコードもとても短く書ける OpenGL と比較すると、Geometry や Material がオブジェ クト化していて使いやすいインターフェースになっている
- 18. 良い所 ブラウザ上で動くのは嬉しい タブレット端末でも動かせるかも！？ 去年、Chrome for Android で WebGL がサポートされた canvas でも動作するので iOS でも使 える
- 19. 悪いところ OpenGL と比べるとドキュメントが全然少ない 公式ページの docs が唯一のドキュメント http://threejs.org/docs/
- 20. 悪いところ http://threejs.org/ docs/#Reference/ Extras.Core/ CurvePath 全部 todo なclass がある GitHubでソースコードが 見れるので、困ったら、実 装を見ながら、使い方を調 べるしか無い＼(^o^)／
- 21. ところで Q. three.js(3次元) があるなら、two.js(2次元)もあるのか？ ➡ A. ある 2次元描画ライブラリ Two.js svg, canvas, webgl でレンダリングできる http://jonobr1.github.io/two.js/
- 22. まとめ まとめ three.js という 3DCG ライブラリがある GPUが使えて、高速に描画できる ブラウザ上でもかなり高度な3DCGが使える ドキュメントはちょっと(かなり？)不足気味 今後の発展に期待！！