注：文章译自，原作者杉本雅広(doxas)，文章中假设有我的额外说明，我会加上［lufy：］，另外，鄙人webgl研究还不够深入，一些专业词语，假设翻译有误，欢迎大家指正。
坐标变换矩阵的基本功能
进行主要的3D渲染的时候，须要准备3个坐标变换矩阵，这个在之前的文章中说过非常多次了。第一个是模型变换矩阵，DirectX中叫做世界变换矩阵。模型变换矩阵影响的是所绘制的模型，模型的位置，模型的旋转，模型的放大和缩小等相关的情况。第二个是视图变换矩阵，简单来说，就是定义拍摄3D空间的镜头（摄像机），决定了镜头的位置，镜头的參考点，镜头的方向等。第三个是投影变换矩阵，这个坐标变换定义了屏幕的横竖比例，剪切的领域等，另外获取远近法则的效果也须要用这个变换矩阵。依据这些内容，差点儿相同知道了须要对矩阵进行哪些操作。使用minMatrix.js能够对矩阵进行主要的操作，来看一下minMatrix.js都能完毕哪些操作吧。
minMatrix.js的基本功能
本站点开发的minMatrix.js，包括矩阵的生成和矩阵的基本操作，minMatrix.js的核心是一个叫做matIV的对象，通过这个对象能够进行全部的矩阵操作，使用minMatrix.js来操作矩阵的时候，首先，须要生成一个matIV对象。
>生成matIV对象的代码
var m = new matIV();像上面这样，变量m就是matIV对象的一个实例，通过m.方法名能够调用matIV对象中存在的方法。以下，列举一下minMatrix.js中定义的matIV对象的方法，先不用立即明确它们的意思，大致看一下就能够。
| >>minMatrix.js:create | ||
| 函数 | : | matIV.create() |
| 參数 | : | 无 |
| 返回值 | : | 矩阵 |
| 生成一个4x4的方阵，里面包括16个元素，事实上是一个Float32Array对象，全部的元素都被初始化为0。 | ||
| >>minMatrix.js:identity | ||
| 函数 | : | matIV.identity(dest) |
| 參数 | : | dest > 初始化的矩阵 |
| 返回值 | : | 初始化后的矩阵 |
| 将接收的矩阵參数进行初始化并返回。 | ||
| >>minMatrix.js:multiply | ||
| 函数 | : | matIV.multiply(mat1,mat2,dest) |
| 參数 | : | mat1 > 相乘的原始矩阵 |
| 參数 | : | mat2 > 作为乘数的矩阵 |
| 參数 | : | dest > 用来保存计算结果的矩阵 |
| mat1在左，mat2在右，相乘后的结果保存到dest中。 | ||
| >>minMatrix.js:scale | ||
| 函数 | : | matIV.scale(mat,vec,dest) |
| 參数 | : | mat > 原始矩阵 |
| 參数 | : | vec > 缩放向量 |
| 參数 | : | dest > 用来保存计算结果的矩阵 |
| 模型变换中的放大缩小，mat是原始矩阵，vec是X，Y，Z的各个缩放值组成的向量，最后的计算结果保存在dest中。 | ||
| >>minMatrix.js:translate | ||
| 函数 | : | matIV.translate(mat,vec,dest) |
| 參数 | : | mat > 原始矩阵 |
| 參数 | : | vec > 表示从原点開始移动一定距离的向量 |
| 參数 | : | dest > 用来保存计算结果的矩阵 |
| 模型变换中的坐标移动，mat是原始矩阵，vec是X，Y，Z的各个方向上的移动量组成的向量，最后将计算结果保存到dest中。 | ||
| >>minMatrix.js:rotate | ||
| 函数 | : | matIV.rotate(mat,angle,axis,dest) |
| 參数 | : | mat > 原始矩阵 |
| 參数 | : | angle > 旋转角度 |
| 參数 | : | axis > 旋转轴的向量 |
| 參数 | : | dest > 用来保存计算结果的矩阵 |
| 模型变换中的旋转，mat是原始矩阵，angle是旋转角度，axis是旋转轴向量，最后将计算结果保存到dest中。 | ||
| >>minMatrix.js:lookAt | ||
| 函数 | : | matIV.lookAt(eye,center,up,dest) |
| 參数 | : | eye > 镜头位置向量 |
| 參数 | : | center > 镜头參考点的向量 |
| 參数 | : | up > 镜头的方向向量 |
| 參数 | : | dest > 用来保存计算结果的矩阵 |
| 视图变换矩阵的生成，eye是镜头在三维空间中的位置，center是这个镜头的參考点，up是镜头的方向向量，最后将计算结果保存到dest中。 | ||
| >>minMatrix.js:perspective | ||
| 函数 | : | matIV.perspective(fovy,aspect,near,far,dest) |
| 參数 | : | fovy > 视角 |
| 參数 | : | aspect > 屏幕的宽高比例 |
| 參数 | : | near > 近截面的位置 |
| 參数 | : | far > 远截面的位置 |
| 參数 | : | dest > 用来保存计算结果的矩阵 |
| 投影变换矩阵的生成，这里生成的是一般被称为［透视射影］的投影变换矩阵，包括远近法则。fovy是视角，aspect是屏幕的横竖比例，near是近截面的位置（必须是大于0的数值），far远截面的位置（随意数值），最后将计算结果保存到dest中。 | ||
| >>minMatrix.js:transpose | ||
| 函数 | : | matIV.transpose() |
| 參数 | : | mat > 原始矩阵 |
| 參数 | : | dest > 用来保存计算结果的矩阵 |
| 矩阵的行列互换，将计算结果保存到dest中。 | ||
| >>minMatrix.js:inverse | ||
| 函数 | : | matIV.inverse(mat,dest) |
| 參数 | : | mat > 原始矩阵 |
| 參数 | : | dest > 用来保存计算结果的矩阵 |
| 求矩阵的逆矩阵，mat是原始矩阵，求的的逆矩阵保存到dest中。 | ||
仅仅包括了特定的功能，所以设计的非常简单。
矩阵变换的流程
使用minMatrix.js的话，能够操作矩阵，那么先来确认一下操作顺序。
模型变换也好，视图变换，投影变换也好，假设不先生成矩阵的话，就什么也做不了。所以首先运行matIV.create生成矩形，然后通过matIV.identity来初始化矩阵，代码例如以下。
>使用matIV对象初始化矩阵
// 生成matIV对象var m = new matIV();// 矩阵初始化var Matrix = m.identity(m.create());这种话，就能够使用Matrix变量了。上面的代码同一时候运行矩阵的生成和初期化，向以下这样分开运行也是能够的。
>使用matIV对象初始化矩阵(2)
var Matrix = m.create();m.identity(Matrix);然后用这个初始化完的矩阵，来运行自己想要的操作。比方，想使用模型矩阵将模型的坐标向x方向移动一个1.0，代码例如以下。 >モデル変換行列に移動成分を与える例
var Matrix = m.identity(m.create());m.translate(Matrix, [1.0, 0.0, 0.0], Matrix);这种话，矩阵Matrix就成为经过了向x方向移动1.0的模型变换后的矩阵了。相同，旋转和缩放也是能够的。可是须要注意的是，移动，旋转，缩放的运行顺序。先移动后旋转和先旋转后移动的结果是有变化的。这是由于旋转是以原点为中心的。所以要十分注意模型变换的运行顺序。详细的运行顺序应该是，扩大缩小>旋转>移动，这样就能将缩放旋转后的模型移动到正确的位置。
可是，这样还没有完。
OpenGL的矩阵使用列向量，相乘的顺序正好相反。假设好好学习矩阵的计算方法的话就非常easy明确了，列向量和行向量的相乘顺序是全然相反的。也就是说，刚才的的顺序 ［扩大缩小>旋转>移动］ 得到的结果是全然不一样的，正确的顺序应该是［移动>旋转>扩大缩小］，所以生成模型变换矩阵的时候，顺序要特别注意了。
视图变换矩阵的生成使用matIV.lookAt函数，投影变换矩阵的生成使用matIV.perspective函数。
到这一步，模型，视图，投影的各个变换矩阵都已经生成了，然后将三个矩阵相乘，生成最后的坐标变换矩阵，数组之间的相乘使用matIV.multiply函数。
可是，这里有些须要注意的地方。
模型，视图，投影的三个矩阵相乘的顺序非常重要，之前的文章（）也说明过了，矩阵相乘的顺序假设改变的话，结果也会改变。尽管说普通的四则运算中求积的时候，左右交换顺序得到的结果是一样的，可是矩阵的话，结果就变了。
坐标变换矩阵一般多使用模型，视图，投影的英文单词的第一个英文字母来表示，如mvpMatrix。相乘的顺序不是mvp，而是p>v>m。使用minMatrix.js的话，代码样例例如以下。
>准备坐标变换的样例
// 各种矩阵的生成和初始化var mMatrix = m.identity(m.create()); // 模型变换矩阵var vMatrix = m.identity(m.create()); // 视图变换矩阵var pMatrix = m.identity(m.create()); // 投影变换矩阵var mvpMatrix = m.identity(m.create()); // 终于的坐标变换矩阵// 各个矩阵相乘的顺序使用演示样例m.multiply(pMatrix, vMatrix, mvpMatrix); // p和v相乘m.multiply(mvpMatrix, mMatrix, mvpMatrix); // 然后和m相乘使用到如今位置的步骤，生成坐标变换矩阵之后，终于通知给WebGL，这种方法下回再说。
总结
这次介绍了一下本站点的矩阵计算的库minMatrix.js的主要的用法，和坐标变换矩阵的顺序。
minMatrix.js通过一个叫做matIV的对象来对矩阵进行操作，各种方法的详细内容，如今不明确也不要紧，等必要的时候会进行详细的说明。生成了坐标变换矩阵之后，离绘制多边形还差一小步了。
下次，终于该让多边形显示到画面上了。
转载请注明：