Three.js での Material と、Light 指定

 Three.js  で、不透明で普通のオブジェクトを、表現したい場合に、どの

Material と、Light を使うのかが、不明であったが、今回解決した。

これまでは、THREE.MeshLamberMaterial をcolor指定のみで使っていた。

これだと、オブジェクトに黒い場所か、グレーの場所が出来てしまう。

ambient を指定し、ambientLigth も追加すれば、上手くいった。

サンプル画像

コード

     var ambientLight = new THREE.AmbientLight(0x666666);
     ThreeScene.add(ambientLight);
     var material = new THREE.MeshLambertMaterial(
        {color:0xff0000, ambient:0xff0000, opacity:1.0}); 

これを使ったWebGL/Three.js のページは、こちら
http://www.nariuchi.com/3d/indexj.html