1. ホーム
  2. javascript

[解決済み] THREE.meshphongmaterialが動作しない - 黒く表示される

2022-02-11 15:05:11

質問

を使おうとしています。 THREE.meshphongmaterial このチュートリアルにある http://solutiondesign.com/webgl-and-three-js-texture-mapping/

しかし、それは動作しませんし、黒色を与える。以下は、そのためのjsfiddleです。 http://jsfiddle.net/8hrk7mu6/12/

32行目に問題があります。

var material = new THREE.MeshPhongMaterial( { ambient: 0x050505, color: 0x0033ff, specular: 0x555555, shininess: 30 } );

なぜうまくいかないのでしょうか?もし私が THREE.MeshNormalMaterial であれば、動作します。

var material = new THREE.MeshNormalMaterial();

その後、私は自分のコードで画像からテクスチャを使用したいです。これもうまくいきません。ただ THREE.MeshNormalMaterial が動作しています。なぜですか?

解決方法は?

その結果、光を加えることが必要であることがわかりました。光がないと meshphongmaterial は黒色になります。

そこで、このようなものを追加する必要がありました。

var light = new THREE.DirectionalLight( 0xffffff );
light.position.set( 0, 1, 1 ).normalize();
scene.add(light);

このリンクから入手しました。 https://github.com/mrdoob/three.js/issues/2766