Three.js 法线贴图着色器是在切线空间计算光照吗？答案

【问题标题】：Is Three.js Normal Map Shader Computing Lighting In Tangent Space?Three.js 法线贴图着色器是在切线空间计算光照吗？
【发布时间】：2013-07-22 00:45:26
【问题描述】：

我只是想熟悉 Three.js，但遇到了一些我无法完全理解的奇怪东西。

在我使用过的大多数其他系统（非基于网络）中，法线贴图的光照是在切线空间中计算的。但在 Three.js 中，情况有些不同。例如，如果您考虑 WebGLShaders.js 中第 2643 行的代码：

"mat3 tsb = mat3( normalize( vTangent ), normalize( vBinormal ), normalize( vNormal ) );",
"vec3 finalNormal = tsb * normalTex;",

他们为切空间建立了正交基矩阵，然后将法线转换到该空间。到目前为止一切顺利。

问题是……这似乎是他们将向量转换为切线空间的唯一地方？？？

所以他们计算的光线方向向量没有转换成切线空间，眼睛方向向量也没有转换？？？这两者随后都用于计算第 2692-2694 行的光照：

"vec3 pointHalfVector = normalize( pointVector + viewPosition );",

"float pointDotNormalHalf = max( dot( normal, pointHalfVector ), 0.0 );",

"float pointSpecularWeight = specularTex.r * max( pow( pointDotNormalHalf, uShininess ), 0.0 );",

这是一种与我习惯的计算高光的方法略有不同的方法。所以我想知道是否有人能够解释他们在做什么？我想知道这个着色器是如何工作的，这样我就可以在为three.js 输出时正确转换统一设置。这是我的终极目标。

【问题讨论】：

标签： three.js

【解决方案1】：

没有。光照计算正在相机空间中进行。

tsb 矩阵（可能应该命名为tbn 矩阵）将法线从切线空间转换为相机空间。

您自己可以看到：如果normalMap 是平坦的，那么normalTex 将是( 0, 0, 1 )，当您通过tbn 矩阵对其进行转换时，您将得到归一化的vNormal 结果.

three.js r.59

【讨论】：