【THREE矩阵】three和mapbox中矩阵运算（列优先）

首先glsl中矩阵存储/向量存储是列优先，就是《pvm*position》的形式，从three的shader里面看出gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );

解析 modelViewMatrix = object.modelViewMatrix.multiplyMatrices( camera.matrixWorldInverse, object.matrixWorld );// camera.matrixWorldInverse相机的世界坐标的逆矩阵就是v矩阵

glsl中大小/平移/旋转矩阵 的解析

mat4 scale(float x, float y, float z)
{
 return mat4(
 x,0,0,0,
 0,y,0,0,
 0,0,z,0,
 0,0,0,1
 );
}
mat4 translate(float x, float y, float z)
{
 return mat4(
 1,0,0,0,
 0,1,0,0,
 0,0,1,0,
 x,y,z,1
 );
}
mat4 rotate(float x, float y, float z, float angle)
{
 float cos0 = cos(-angle);
 float sin0 = sin(-angle);
 float t = 1.0f - cos0;
 float txx = t * x * x;
 float txy = t * x * y;
 float txz = t * x * z;
 float tyy = t * y * y;
 float tyz = t * y * z;
 float tzz = t * z * z;
 float sinx = sin0 * x;
 float siny = sin0 * y;
 float sinz = sin0 * z;
 
 return mat4(
 txx+cos0,txy-sinz,txz+siny,0,
 txy+sinz,tyy+cos0,tyz-sinx,0,
 txz-siny,tyz+sinx,tzz+cos0,0,
 0,0,0,1
 );
}
 

1.three

像数学里面正常的平移矩阵为
1 0 0 zx
0 1 0 zy
0 0 1 zz
0 0 0 1

在three里面平移矩阵的是这样（列优先）

[1（0）,0,0,0,0（4）,1,0,0,0（8）,0,1,0,zx（12）,zy,zz,1]

从矩阵向量的计算方法可以看出
applyMatrix4: function ( m ) {
var x = this.x, y = this.y, z = this.z, w = this.w;
var e = m.elements;
this.x = e[ 0 ] * x + e[ 4 ] * y + e[ 8 ] * z + e[ 12 ] * w;
this.y = e[ 1 ] * x + e[ 5 ] * y + e[ 9 ] * z + e[ 13 ] * w;
this.z = e[ 2 ] * x + e[ 6 ] * y + e[ 10 ] * z + e[ 14 ] * w;
this.w = e[ 3 ] * x + e[ 7 ] * y + e[ 11 ] * z + e[ 15 ] * w;
return this;
}
从矩阵矩阵也可以看出three的矩阵里面保存是数组的形式，列优先，当然相乘的时候，和正常矩阵相乘的坐标一致

2.mapbox矩阵用的是gl-matrix

从平移矩阵来分析 translate(out, a, v)，就是out=a矩阵*平移矩阵（【1000 0100 0010 zx zy zz 1】）

可以看出gl-martix中矩阵是数组形式来保存，也是列优先的,

从shader 顶点计算也可以看出gl_Position = u_matrix * vec4(a_pos, 0, 1);PVM

记得矩阵都是来乘得时候 都是在左边依次相乘~~~~~~~~~~~~~~~~~~~~~~~~~如 P * V * M * position（x y z 1）

3.three中object的矩阵运算

this.matrix = new Matrix4();//这个从调试结果看不变，本地矩阵.materix
this.matrixWorld = new Matrix4();//这个从调试结果看变化，世界矩阵.matrixWorld

如果这个节点不是父节点的话，它的世界矩阵，需要父节点世界矩阵*这个节点的本地矩阵==》
this.matrixWorld.multiplyMatrices( this.parent.matrixWorld, this.matrix );

如果是没有父节点，它的世界矩阵就是本身的世界矩阵==》
this.matrixWorld.copy( this.matrix );

下面博客讲解比较清楚：
three.js中的矩阵变换(模型视图投影变换)