Three.jsでカスタムジオメトリのライトを計算する

私はカスタムジオメトリを作成しましたが、照明を正しく取得するためにgeometry.computeFaceNormals()を使用しました。ここまでは順調ですね。Three.jsでカスタムジオメトリのライトを計算する

ジオメトリをアニメーション化すると問題が発生します。アニメーションループでは、私は再びgeometry.computeFaceNormals()を呼び出しますが、フェイスの照明は変わりません。ここで

は一例でfiddleです：

three.js

var material = new THREE.MeshPhongMaterial({ color: 0xFFFFFF, shading: THREE.FlatShading });

あなたはフラットシェーディングをしたいですか？ https://jsfiddle.net/z6td0srh/5/またはスムーズシェーディング？ https://jsfiddle.net/z6td0srh/6/ – WestLangley

ありがとう@WestLangley！私は平らな陰影を探していた。あなたのコメントを精緻化して答えを出すように、私はそれを答えとしてマークすることができます。 – guardabrazo

あなたのジオメトリの頂点を更新しているので、一般的に、あなたの法線も正しいとシェーディングのために更新する必要があります。

ただし、フラットシェーディングが必要なため、別の解決策があります。

MeshPhongMaterialは、OES_standard_derivatives拡張を使用してフラットシェーディングを生成します。つまり、頂点が変更されたときに、ジオメトリの法線を指定または更新する必要はありません。

拡張機能がサポートされている場合は、次のパターンを使用して、フラットシェーディングが「うまくいく」だけです。 R.80

2016-08-28 20:35:34 WestLangley

答えて