模型视图矩阵和投影矩阵：webgl笔记

最近在学习WebGL技术的过程中，我补充了一些原本了解甚少的计算机图形学知识。如果有同学和我一样，没有系统学过计算机图形学就接触了3D图形编程，而对不少略为艰深的概念有困惑，希望这些笔记能够帮助你。

模型矩阵

我们必须考虑，当空间中点的位置会发生变化的时候，其坐标如何变化。考虑三种基本的变换：平移、旋转和缩放。

“变换”的含义就是，将点的初始位置的坐标P映射到平移、旋转、缩放后的位置坐标P’，即：

平移变换是最简单的变换：

旋转变换有一些复杂，先看在二维平面上的旋转变换：

很容易得到：

矩阵形式的表达更加简洁，后面大多使用这种形式：

推广到三维空间中：

点绕z轴旋转：

点绕x轴旋转：

点绕y轴旋转：

绕指定的任意轴旋转变换是由几个绕坐标轴旋转变换和平移变换效果叠加而成的，后文会有详细叙述。

缩放变换也比较简单：

总结一下：平移变换，变换后点坐标等于初始位置点坐标加上一个平移向量；而旋转变换和缩放变换，http://fei 变换后点坐标等于初始位置点坐标乘以一个变换矩阵。

齐次坐标这天才的发明，允许平移变换也表示成初始位置点坐标左乘一个变换矩阵的形式。齐次坐标使用4个分量来表示三维空间中的点，前三个分量和普通坐标一样，第四个分量为1。

平移变换巧妙地表示为：

旋转变换（以绕z轴旋转为例）和缩放变换相应为：

综上，在齐次坐标下三种基本变换实现了形式上的统一，这种形式的统一意义重大。

矩阵有一个性质：

考虑一个点，先进行了一次平移变换，又进行了一次旋转变换，结合上面矩阵的性质，可知变换后的点P’为：

旋转矩阵和平移矩阵的乘积R·T也是一个4×4的矩阵，这个矩阵代表了一次平移变换和一次旋转变换效果的叠加；如果这个点还要进行变换，只要将新的变换矩阵按照顺序左乘这个矩阵，得到的新矩阵能够表示之前所有变换效果的叠加，将最初的点坐标左乘这个矩阵就能得到一系列变换后最终的点坐标，这个矩阵称为“模型矩阵”。一个模型矩阵乘以另一个模型矩阵得到的还是一个模型矩阵，表示先进行右侧模型矩阵代表的变换，再进行左侧模型矩阵代表的变换这一过程的效果之和，因此模型矩阵的乘法又可以认为是闭合的。

模型矩阵之所以称之为“模型矩阵”，是因为该矩阵与点的位置没有关系，仅仅包含了一系列变换的信息。而在三维世界中，一个模型里所有的顶点往往共享同一个变换，对应同一个模型矩阵，比如抛在空中的一个木块，运转机器的一个齿轮。

之前说到，考虑一个物体绕指定轴旋转，如以下这个变换：绕着过顶点（x，y，z）方向为（a，b，c）的轴旋转角度θ，利用多个变换的叠加构建绕任意轴旋转的变换矩阵。首先将顶点（x，y，z）平移到原点，绕x轴旋转角度p使指定的旋转轴在x-z平面上，绕y轴旋转角度q使指定的旋转轴与z轴重合，绕指定旋转轴（也就是z轴）旋转角度θ，绕y轴旋转角度-q，绕x轴旋转角度-p,将顶点平移到向量（x，y，z），p和q 的值由方向（a，b，c）决定。综上，变换矩阵为：

因此在处理围绕非坐标轴旋转的模型时，根据指定的旋转参数可以直接按照上述公式生成按照指定轴旋转的旋转矩阵，参加模型矩阵的构建。

齐次坐标还有一个优点，能够区分点和向量：在普通坐标里，点和向量都是由三个分量组成的，表示位置的点坐标（2，3，4）和表示方向的向量（2，3，4）没有区别。而在齐次坐标中，第四个分量可以区分它们，点坐标的第四个分量为1，而向量坐标第四个分量为0。比如，平移一个点是有意义的，能够得到平移后的点坐标；而平移一个向量是没有意义的，方向不会因为平移而改变。

以上，我们已经了解到模型矩阵可以存储一个模型空间位置变化的信息，在生成三维动画每一帧的过程中，我们首先计算每个模型的模型矩阵，然后将最初的模型的每一顶点坐标都左乘该模型矩阵，得到这一帧表示的时刻（模型已经经过多次变换）该模型每一顶点的坐标。上面说的“帧”并不狭义地指屏幕的两次刷新时间的短暂间隔中屏幕上呈现的图像，而是指在这幅图像所描绘的整个三维空间的这个瞬间的所有顶点的位置。

来看个具体的例子：一个绕z轴匀速螺旋匀速上升的立方体，在某一帧中（即在这一帧对应的时刻t下），其向z轴正方向平移的长度和绕z轴旋转的角度分别为：

则模型矩阵（注意上文齐次坐标下的基本变换矩阵）为：

产生这一帧时，只需要计算一次模型矩阵，再将立方体中8个顶点坐标分别左乘该矩阵，就可以得到经过变换后8个顶点的坐标。当一个模型顶点数量增加到上百甚至上千个，模型变换的步骤数也增加到几十步时，模型矩阵的作用就很明显了：如果没有齐次坐标（也当然没有模型矩阵），对每个顶点都需要一步一步地变换：平移的时候加上一个向量，旋转的时候左乘一个矩阵，才能得到变换后的顶点坐标；而模型变换只需要计算一次模型矩阵（当然也是一步一步的），然后每个顶点左乘模型矩阵就可以直接得到变换后的坐标了。

视图矩阵

在模型矩阵中，我们关心的是空间中的点在经历变换后在世界坐标系下的位置。事实上，我们更加关心空间中的点相对于观察者的位置。最简单的方案是将观察者置于原点处，面向z轴（或x轴、y轴）正半轴，那么空间中的点在世界坐标系下的位置就是其相对于观察者的位置。

观察者的位置和方向会变化，看上去就好像整个世界的位置和方向发生变化了一样，所以解决的方案很简单，将世界里的所有模型看作一个大模型，在所有模型矩阵的左侧再乘以一个表示整个世界变换的模型矩阵，就可以了。这个表示整个世界变换的矩阵又称为“视图矩阵”，因为他们经常一起工作，所以将视图矩阵乘以模型矩阵得到的矩阵称为“模型视图矩阵”。模型视图矩阵的作用是：乘以一个点坐标，获得一个新的点坐标，获得的点坐标表示点在世界里变换，观察者也变换后，点相对于观察者的位置。

视图矩阵同样也可以分为平移、旋转和缩放，视图矩阵是将观察者视为一个模型，获得的观察者在世界中变换的模型矩阵的逆矩阵。

观察者平移了（tx，ty，tz），视图矩阵如下，可以看出如果将视图矩阵看作整个世界的模型矩阵，相当于整个世界平移了（-tx，-ty，-tz）。

观察者绕z轴旋转了角度θ，视图矩阵如下，相当于整个世界绕z轴旋转了-θ度。

观察者在三个方向等比例缩小了s倍，视图矩阵如下，相当于整个世界放大了s倍。