什么是MVP矩阵？
MVP矩阵是3D图形编程中用于对象变换的三个基本矩阵的组合：
- Model矩阵（模型矩阵）：将对象从局部坐标系变换到世界坐标系
- View矩阵（视图矩阵）：将对象从世界坐标系变换到相机坐标系
- Projection矩阵（投影矩阵）：将对象从相机坐标系变换到裁剪空间（Clip Space）
这些矩阵的作用
Model矩阵
- 对对象进行平移、旋转和缩放
- 定义对象在世界中的位置和方向
View矩阵
- 定义相机的位置和朝向
- 本质上是将整个场景变换，使得相机位于原点并朝向特定方向
Projection矩阵
- 定义相机的视野（如视角、宽高比、近平面和远平面）
- 将3D坐标映射到2D屏幕上
- 常见的投影方式有透视投影（Perspective）和正交投影（Orthographic）
矩阵应用顺序
在着色器中，变换顺序为：
gl_Position = ProjectionMatrix * ViewMatrix * ModelMatrix * position;
- 首先应用Model矩阵，将顶点从局部坐标变换到世界坐标
- 然后应用View矩阵，将顶点从世界坐标变换到相机坐标
- 最后应用Projection矩阵，将顶点从相机坐标变换到裁剪空间
WebGL 3D变换矩阵详解
矩阵基础
在WebGL中，我们使用4×4矩阵来表示3D变换。这些矩阵按列主序存储在Float32Array中。
单位矩阵 (Identity Matrix)
[1 0 0 0]
[0 1 0 0]
[0 0 1 0]
[0 0 0 1]
单位矩阵是变换的起点，它不会改变应用于它的任何向量。就像乘以数字1一样。
基本变换矩阵
平移矩阵 (Translation Matrix)
[1 0 0 0]
[0 1 0 0]
[0 0 1 0]
[tx ty tz 1]
-
tx,ty,tz是在x、y、z轴上的平移量 - 平移矩阵将点(x,y,z)移动到(x+tx, y+ty, z+tz)
旋转矩阵 (Rotation Matrix)
绕X轴旋转
[1 0 0 0]
[0 cos θ -sin θ 0]
[0 sin θ cos θ 0]
[0 0 0 1]
绕Y轴旋转
[cos θ 0 sin θ 0]
[0 1 0 0]
[-sin θ 0 cos θ 0]
[0 0 0 1]
绕Z轴旋转
[cos θ -sin θ 0 0]
[sin θ cos θ 0 0]
[0 0 1 0]
[0 0 0 1]
- θ 是旋转角度（通常以弧度表示）
- 正角度表示按右手法则的方向旋转
缩放矩阵 (Scaling Matrix)
[sx 0 0 0]
[0 sy 0 0]
[0 0 sz 0]
[0 0 0 1]
-
sx,sy,sz是在x、y、z轴上的缩放因子
投影矩阵
透视投影矩阵
[f/aspect 0 0 0]
[0 f 0 0]
[0 0 (far+near)/(near-far) -1]
[0 0 (2*far*near)/(near-far) 0]
其中：
-
f = 1.0 / tan(fov/2)是视场角的函数 -
aspect是视口的宽高比 -
near是近平面距离 -
far是远平面距离
透视投影创建近大远小的效果，模拟真实世界的观察。
正交投影矩阵
[2/(right-left) 0 0 0]
[0 2/(top-bottom) 0 0]
[0 0 2/(near-far) 0]
[(left+right)/(left-right) (top+bottom)/(bottom-top) (near+far)/(near-far) 1]
正交投影保持物体大小不变，不管距离观察者多远。
矩阵组合
多个变换可以通过矩阵乘法组合。变换应用顺序与乘法顺序相反。
例如，要先旋转后平移一个物体：
finalMatrix = multiplyMatrices(translationMatrix, rotationMatrix);
矩阵乘法
对于两个4×4矩阵A和B，结果矩阵C = A×B中的每个元素计算方式为：
C[i,j] = A[i,0]*B[0,j] + A[i,1]*B[1,j] + A[i,2]*B[2,j] + A[i,3]*B[3,j]
其中i和j分别是行和列的索引（0到3）。
