オライリーからthree.jsの書籍が新発売されていたので、
購入してみました。html5のcanvasを利用して
javascriptによる制御で3D表現を実現するためのライブラリのようです。
jqueryみたいなものですね。

こんな感じで簡単にできてしまいます。

[javascript] //必要なライブラリを読み込みます。
<script src="three.min.js"></script>
//3Dの形状データを読み込みます
<script src="three.js-master/examples/js/loaders/STLLoader.js"></script>
//マウス操作可能になります
<script src="three.js-master/examples/js/controls/TrackballControls.js"></script>
<script>

var OBJ = OBJ || {};

OBJ.animate = function() {
OBJ.renderer.render( OBJ.scene, OBJ.camera );
OBJ.controls.update();
requestAnimationFrame( OBJ.animate );
mesh.rotation.y += .01;
};

// Scene
OBJ.scene = new THREE.Scene();
OBJ.scene.add( OBJ.camera );

// Renderer
OBJ.renderer = new THREE.WebGLRenderer();
OBJ.renderer.setSize(window.innerWidth, window.innerHeight);
OBJ.renderer.setClearColor(0xcccccc, 1);
document.body.appendChild( OBJ.renderer.domElement );

// Camera
OBJ.camera = new THREE.PerspectiveCamera();
OBJ.camera.position.z = 100;

// Light
var directionalLight = new THREE.DirectionalLight( 0x555555, 1 );
directionalLight.position.y = 10;
directionalLight.position.z = 10;
OBJ.scene.add( directionalLight );
var aLight = new THREE.AmbientLight( 0x444444);
OBJ.scene.add( aLight );

//3D
var loader = new THREE.STLLoader();
loader.load( ’33 Willis Panel.stl’, function ( geometry ) {
var material = new THREE.MeshLambertMaterial( { ambient: 0xffffff, color: 0xffffff} );

mesh = new THREE.Mesh( geometry, material );
mesh.rotation.y = 0;

OBJ.scene.add( mesh );

// Controls
OBJ.controls = new THREE.TrackballControls( OBJ.camera );
OBJ.animate();
});

</script>

[/javascript]

サンプル

モチーフは最初から円や柱など最初から用意されているもの（ジオメトリ）をインスタンス化することも
できますし、上記のようにstlファイルという3Dの形状データを読み込んで出力することも
可能です。

簡単に解説すると、
まず、Sceneを用意します。
これは画面に表示するすべての物体と利用したい光源などを監視するコンテナオブジェクトです。
これがないと何も始まりません！
Sceneに3Dオブジェクトやカメラ、光源など必要に応じて
各オブジェクトを追加していく考えになります。
オブジェクトを作成する場合は、ジオメトリ（形状）とマテリアル（材質）を設定して
THREE.Meshでそれらをまとめることでオブジェクトが生成可能です。

Cameraオブジェクトは
シーンを描画する際に何が見えるのかを決定します。
もちろん角度や画角などのプロパティも設定可能です。

LightはSceneオブジェクトに対しての光源を設定します。

RendererはCameraオブジェクトを基に
画面内でSceneオブジェクトがどのように見えるかを計算します。
背景色・画面サイズとかもここで設定可能です。

あとはアニメですね。
考え方としては、rendererを繰り返し呼び出して
プロパティ値を変更していく流れです。単純ですね。
もちろん上記のようにユーザーの操作で動かすことも可能です。
この辺はとくに3Dだからと言って特別な処理はなく、
2Dを動かすのと同じですね。

ざっくりですが、
上記の記述だけでも例えば、車とか靴とかの
3Dを画面上で見たいなどといった表現はできちゃいますね。
形状データを作るのは大変でしょうが・・・

まだ勉強中なので今後もっと深堀していきたいと思います。