法线矩阵推导

法线矩阵推导

https://zhuanlan.zhihu.com/p/72734738
https://juejin.cn/post/7113952418613690382
https://blog.csdn.net/wangjianxin97?type=blog

1、为什么需要法线矩阵

vec3 normalEyeSpace = modelViewMatrix * normal;

如果模型矩阵执行了非等比缩放, 顶点的改变会导致法向量不再保持垂直关系。

法线矩阵推导_第1张图片

缩放后 n n n不在与线段垂直了, 真正垂直的是 n ′ n' n

three.js 代码:

const geometry = new THREE.BufferGeometry()
const position = [];
const normals = [];
position.push(-1, 0, 0)
position.push(1, 0, 0)
position.push(0, 1, 0)

normals.push(0.5, 0.5, 0)
normals.push(0.5, 0.5, 0)
normals.push(0.5, 0.5, 0)

geometry.setAttribute('position', new THREE.Float32BufferAttribute(position, 3))
geometry.setAttribute('normal', new THREE.Float32BufferAttribute(normals, 3))

const material = new THREE.ShaderMaterial({
  vertexShader: `
    varying vec3 vNormal;
    void main() {
      vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
      gl_Position = projectionMatrix * mvPosition;
      vNormal = normal;
    }
  `,
  fragmentShader: `
    varying vec3 vNormal;
    uniform mat3 normalMatrix;
    void main() {
      gl_FragColor = vec4( vNormal, 1.0 );
    }
  `,
});

const mesh = new THREE.Mesh(geometry, material);
mesh.scale.set(0.5, 1, 1)

2 法向量矩阵推导

约定:

  • 向量用小写字母的表示
  • 转换矩阵用大写字母表示

法线矩阵推导_第2张图片

假设矩阵 G G G 转换法向量, 矩阵 M M M转换切线。
如果转换到视图空间,那么 M M M就是modelViewMatrix, 如果转换到世界空间, M M M就是modelMatrix

根据假设有:
n ′ = G n t ′ = M t n' = G n \\ t' = M t \\ n=Gnt=Mt

根据几何关系有:
n ⋅ t = n ′ ⋅ t ′ = 0 n \cdot t = n' \cdot t' = 0 nt=nt=0

带入有:
n ′ ⋅ t ′ = ( G n ) ⋅ ( M t ) = ( G n ) T ( M t ) = n T G T M t \begin{aligned} n' \cdot t' &= (G n) \cdot (M t) \\ &= (G n)^{T} (M t) \\ &= n^{T} G^{T} M t \\ \end{aligned} nt=(Gn)(Mt)=(Gn)T(Mt)=nTGTMt

因为(向量点积用矩阵表示):
n ⋅ t = n T t = n ′ ⋅ t ′ n \cdot t = n^{T} t = n' \cdot t' nt=nTt=nt

所以,满足上式, 只需:
G T M = I G^{T} M = I GTM=I

因此:
G T = M − 1 ( G T ) T = ( M − 1 ) T G = ( M − 1 ) T \begin{aligned} G^{T} &= M^{-1} \\ (G^{T})^{T} &= (M^{-1})^{T} \\ G &= (M^{-1})^{T} \end{aligned} GT(GT)TG=M1=(M1)T=(M1)T

你可能感兴趣的:(计算机图形学,矩阵,线性代数)