【Three.js】Three.jsとは？3DのWebコンテンツ制作

どうも、とがみんです。

この記事では、Webブラウザーに、3DグラフィックをレンダリングするためのWebGLのJavaScriptライブラリである「Three.js」について紹介します。

Contents

Three.jsとは？

「Three.js」とは、HTML5で3Dのコンテンツを制作するためのJavaScriptライブラリです。

このライブラリを使用すれば、JavaScriptの知識だけで、簡単に3Dコンテンツを作成することが可能です。

以下は、「Three.js」で作成した立方体です。

Three.jsで立方体 pic.twitter.com/tWMGgf9yXj
— 究極の自由を追求するブログFresopiya (@fresopiya) July 7, 2019

以下のボタンを押すと、立方体が記事内に表示されます。マウスを利用して、動かすことも可能です。

以下のようなスライドショーみたいな物も作成することができます。

3D空間にただただ画像を配置してみた。 pic.twitter.com/fP9uK04Y0L
— 究極の自由を追求するブログFresopiya (@fresopiya) July 7, 2019

「Three.js」の公式ホームページにたくさんサンプルが載っているのですが、その世界観は半端ない。。。

「Three.js」について紹介しました。