1

我正在尝试使用 Three.js r.58 法线着色器来制作置换贴图。我让它正确位移，但即使我使用 computeTangents()，照明似乎也不尊重位移后的法线。

当我关闭置换时，我看到默认的法线肯定很有趣。这是一个球体的俯视图，从侧面照亮（白点标志着一个点光源）：

具有正常着色器的球体顶视图，从侧面照亮

这是一个演示页面： http: //meetar.github.io/three.js-normal-map-0/index0.html

这是什么原因造成的？是否有关于 Three.js 普通着色器的文档？

4

2 回答 2

1

  1. 您没有传入一个 normalMap，这是必需的。尝试通过一个平坦的。

  2. ComputeTangents()可以在具有不连续 UV 的顶点上做奇怪的事情——比如在北极。

  3. 代码是文档。:-)

于 2013-07-03T17:15:19.483 回答
0

“扭曲”法线是每个顶点法线被评估为 RGB 值的结果(255, 255, 255)，它对应于切线空间 XYZ 坐标(1.0, 1.0, 1.0)。当使用 three.js 法线贴图材质而不传递法线贴图时，这似乎是默认行为。如果你传递一个全白的法线贴图，你会看到同样的行为。

要将法线贴图传递给法线贴图着色器，请将此行添加到您的统一声明中：

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

要传递“平面”法线贴图，请制作“normalmap.png”实心(128, 128, 255)淡紫色，将其标准化为切线空间坐标(0.0, 0.0, 1.0)。

有关包含大量示例的法线贴图的详细分类，请查看此链接：http ://wiki.polycount.com/NormalMap/

于 2013-07-09T13:59:55.513 回答