JavascriptのWebGLコンテキストで3Dコンテンツを作る(three.jsを使用)
HTMLのCanvasタグでWebGLコンテキストを使うとブラウザで３Ｄコンテンツを表現できますが、これを自力で扱うのはとても大変です。 そこでthree.js（https://threejs.org/ ）を使えばJavaScriptの知識だけで簡単にWebで３Ｄコンテンツを扱えるようになります。
WebGL(three.js)
- WebGL(three.js)
-
Three.jsでWeb3D(WebGL) ～カメラ制御[OrbitControls]
Three.jsでOrbitControlsを使ってマウスのドラッグやスワイプ・ピンチイン／アウトでカメラ制御（Three.js[r145]を使用）
-
Three.jsでWeb3D(WebGL) ～影を表示し影のエッジをぼかす
Three.jsで影を表示し影のエッジをぼかすThree.jsで影を表示し影のエッジをぼかす（Three.js[r145]を使用）
-
Three.jsでWeb3D(WebGL) ～テキストの表示
Three.jsでテキスト(文字)を表示する方法をソースコードと実例で解説
-
Three.jsでWeb3D(WebGL) ～６種のMaterialの使い方
６種のMaterialの使い方（MeshBasicMaterial、MeshNormalMaterial、MeshLambertMaterial、MeshPhongMaterial、MeshToonMaterial、MeshStandardMaterial）（Three.js[r145]を使用）
-
Three.jsでWeb3D(WebGL) ～テクスチャマッピングを行う
テクスチャマッピングを行う THREE.TextureLoader().load("ファイル名")（Three.js[r145]を使用）
-
Three.jsでWeb3D(WebGL) ～バンプ マップ、ディスプレイスメント マップを使う[bumpMap,displacementMap]
「バンプ マップ(bumpMap)」「ディスプレイスメント マップ(displacementMap)」を使う（Three.js[r145]を使用）
-
Three.jsでWeb3D(WebGL) ～様々なジオメトリ（形状）を作る
様々なジオメトリ（形状）を作る(Three.js[r145]を使用)
-
Three.jsでWeb3D(WebGL) ～3Dオブジェクトをグループ化（まとめて管理）する
3Dオブジェクトをグループ化（まとめて管理）する THREE.Group（Three.js[r145]を使用）
-
Three.jsでWeb3D(WebGL) ～フォグ(fog,霧)機能を使う
3フォグ(fog,霧)機能を使う(Three.js[r145]を使用)
-
Three.jsでWeb3D(WebGL) ～360度写真をパノラマ表示
360度写真をパノラマ表示する（Three.js[r145]を使用）
-
Three.jsでWeb3D(WebGL) ～360度写真をパノラマ表示してバーチャル展示会
360度写真をパノラマ表示してバーチャル展示会（クリックやタップで説明表示）（Three.js[r145]を使用）
-
Three.jsでWeb3D(WebGL) ～迷路を作成して３Ｄ表示しマウスボタン長押し（ロングタップ）でカメラを前進後退、左右回転して迷路内をウォークスルー
迷路を作成して３Ｄ表示しマウスボタン長押し（ロングタップ）でカメラを前進、後退、左右回転して迷路内をウォークスルーする（Three.js[r145]を使用）
-
Three.jsで「OBJLoader.js」を使ってOBJファイルをロードして表示する
「OBJLoader.js」を使ってOBJファイルをロードして表示する（Three.js[r145]を使用）
-
Three.jsで「OBJLoader.js」でOBJファイルをロードし「MTLLoader.js」でMTLファイル（マテリアルファイル）をロードして適用して表示する
Three.jsで「OBJLoader.js」を使ってOBJファイルをロードし、「MTLLoader.js」を使ってMTLファイル（マテリアルファイル）をロードして適用して表示する(Three.js[r145]を使用)
-
Three.jsで反射マッピング（鏡のように周りのものが映る）
鏡のように周りのものが映り込むキューブ反射マッピング(Three.js[r145]を使用)
-
ガラス玉のように屈折透過
ガラス玉のように屈折透過するキューブ屈折マッピング(Three.js[r145]を使用)
-
３Ｄバッティングゲーム
Webサイトで３Ｄバッティングゲーム(Three.js[r145]を使用)
-
３Ｄスロットマシン
Webサイトで３Ｄスロットマシン ゲーム(Three.js[r145]を使用)
-
three.jsを使ったWebGL
Three.jsを使ってWebで3D表示（WebGL）
-
CSS3Dを使って2DのHTMLを3Dに表示する
Three.jsのCSS3Dを使って3DオブジェクトにHTMLを表示する
-
３Ｄオブジェクトのクリックとタッチ
3Dオブジェクトをclickやtouchに応答させる（ビジョントレーニングのアプリ）
-
OBJファイルの表示
OBJ,MTLファイルを表示する