1

Three.js r.58 法線シェーダーを使用してディスプレイスメント マップを作成しようとしています。正しくディスプレイスメントされていますが、computeTangents() を使用しても、照明がディスプレイスメント後の法線を尊重していないようです。

ディスプレイスメントをオフにすると、デフォルトの法線が明らかにおかしいことがわかります。これは、側面から照らされた球体の上面図です (白い点は pointLight を示します)。

側面から照らされた、通常のシェーダを使用した球の上面図

そして、ここにデモページがあります: http://meetar.github.io/three.js-normal-map-0/index0.html

何が原因ですか?また、Three.js ノーマル シェーダーのドキュメントはどこにありますか?

4

2 に答える 2

0

「ねじれた」法線は(255, 255, 255)、接線空間の XYZ 座標に対応するRGB 値 として評価される各頂点法線の結果です(1.0, 1.0, 1.0)。これは、法線マップを渡さずに three.js 法線マップ マテリアルを使用する場合のデフォルトの動作のようです。真っ白な法線マップを渡すと、同じ動作が見られます。

法線マップを法線マップ シェーダーに渡すには、次の行をユニフォーム宣言に追加します。

uniforms[ "tNormal" ].value = new THREE.ImageUtils.loadTexture( 'normalmap.png' );

「フラットな」法線マップを渡すには、(128, 128, 255)接線空間座標に正規化する「normalmap.png」ソリッド ラベンダーを作成します(0.0, 0.0, 1.0)

多くの例を含む法線マップの詳細な内訳については、このリンクをチェックしてください: http://wiki.polycount.com/NormalMap/

于 2013-07-09T13:59:55.513 に答える