WebGL & Three.js

Three.jsでOrbitControlsを使って簡単にマウスで視点の操作する方法を紹介します。

まずはデモを確認してみましょう。

OrbitControlsとは?

OrbitControl ...

WebGL & Three.js

Three.jsでマテリアルのテスクチャーに画像や動画を設定する方法を紹介します。
さっそくデモを確認してみましょう。

3Dモデルを表示

Three.jsのShaderMateria ...

WebGL & Three.js

Three.jsでMaterial(マテリアル)の色を設定するとき、いろいろな方法があります。
知らないと混乱したり、便利な使い方もあるので、色の設定方法を一覧できるように紹介します。

もしTh ...

WebGL & Three.js

Three.jsのMaterial(マテリアル)の基本的な種類を実際に3Dモデルのデモを動かしながら確認してみてましょう。
もしThree.jsの基本的な操作の一連の流れを知らないという場合は、Three. ...

WebGL & Three.js

Three.jsのGeometry(ジオメトリ)の基本的な種類を実際に3Dモデルのデモを動かしながら確認してみてましょう。
もしThree.jsの基本的な操作の一連の流れを知らないという場合は、Three. ...

WebGL & Three.js

WebGL&Three.jsの入門としてThree.jsのチュートリアルに記載されているサンプルコードの基本を解説します。
とっつきにくそうではなりますが、ちょっと中身がわかれば全然そんなことがな ...

WebGL & Three.js

Three.jsは、WebGLを簡単に使用するための現状最も有名なJavaScriptライブラリです。
Three.jsやWebGLが何?という場合は、WebGLとThree.jsの違いって何?押さえておき ...

WebGL & Three.js

ブラウザ上で3Dグラフィクスを描いてみたいと考えたとき、
よく出てくる言葉として「WebGL」や「Three.js」と出会う機会があります。
WebGLとThree.jsの違い、そもそもどういう意味 ...