matrix的概念matrix在threejs中的应用matrix用于旋转一个几何体创建一个立方体cube放在场景中;围绕向量(1,1,0)旋转30度varaxis=newTHREE.Vector3(1,1,0);//创建三维向量varrotWorldMatrix=newTHREE.Matrix4();//创建一个4*4的矩阵rotWorldMatrix.makeRotationAxis(axis.normalize(),30*Math.PI/180);rotWorldMatrix.multiply(cube.matrix);//pre-multiplycube.matrix=rotWorldMatrix;cube.rotation.setFromRotationMatrix(cube.matrix);旋转前后,比较向量一定要从几何体中心指向外侧?你能围绕一个不以点为起点的矢量旋转吗?代码详解在三维空间创建一个点varaxis=newTHREE.Vector3(1,1,0);打印出axiosTHREE.Vector3(1,1,0).normalize()axis.normalize()//返回一个向量,方向与指定向量相同,但长度为1。如:varaxis=newTHREE.Vector3(10,20,0);console.log(axis.normalize());//{x:0.4472135954999579,y:0.8944271909999159,z:0}(0.4472135954999579^2)+(0.8944271909999159^2)+(0^2)=1varaxis1=newTHREE.Vector3(1,1,0);log(axis1.normalize())//{x:0.7071067811865475,y:0.7071067811865475,z:0}(0.7071067811865475^2)+(0.7071067811865475^2)+(0^2)=1创建一个4*4矩阵变量旋转世界矩阵=newTHREE.Matrix4();console.log(rotWorldMatrix)根据弧度传入的轴旋转上面创建的4×4矩阵rotWorldMatrix.makeRotationAxis(rotationaxis,rotationradian)//Matrix4原型上的方法//axis=axis.normalize()是{x:0.7071067811865475,y:0.7071067811865475,z:0}//angle=30*Math.PI/180ispi/6makeRotationAxis:function(axis,angle){varc=Math.cos(角度);//Math.cos(π/6)vars=Math.sin(角度);//Math.sin(π/6)vart=1-c;varx=axis.x,y=axis.y,z=axis.z;vartx=t*x,ty=t*y;this.set(tx*x+c,tx*y-s*z,tx*z+s*y,0,tx*y+s*z,ty*y+c,ty*z-s*x,0,tx*z-s*y,ty*z+s*x,t*z*z+c,0,0,0,0,1);返回这个;},rotWorldMatrix.makeRotationAxis(axis.normalize(),30*Math.PI/180);rotWorldMatrix的初始值为{elements:[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1]}执行makeRotationAxis后的值()is:将根据旋转轴和弧度旋转的矩阵和几何体矩阵乘法rotWorldMatrix.multiply(cube.matrix);//框架源码multiply:function(m,n){if(n!==undefined){//这里n是未定义的,因为在cube.matrix中只传递了一个值returnthis.multiplyMatrices(m,n);}returnthis.multiplyMatrices(this,m);},multiplyMatrices:function(a,b){varae=a.elements;//rotWorldMatrix.elementsvarbe=b.elements;//cube.matrix.elementsvarte=this.elements;//ae和te全等vara11=ae[0],a12=ae[4],a13=ae[8],a14=ae[12];vara21=ae[1],a22=ae[5],a23=ae[9],a24=ae[13];vara31=ae[2],a32=ae[6],a33=ae[10],a34=ae[14];vara41=ae[3],a42=ae[7],a43=ae[11],a44=ae[15];varb11=be[0],b12=be[4],b13=be[8],b14=be[12];varb21=be[1],b22=be[5],b23=be[9],b24=be[13];varb31=be[2],b32=be[6],b33=be[10],b34=be[14];varb41=be[3],b42=be[7],b43=be[11],b44=be[15];te[0]=a11*b11+a12*b21+a13*b31+a14*b41;te[4]=a11*b12+a12*b22+a13*b32+a14*b42;te[8]=a11*b13+a12*b23+a13*b33+a14*b43;te[12]=a11*b14+a12*b24+a13*b34+a14*b44;te[1]=a21*b11+a22*b21+a23*b31+a24*b41;te[5]=a21*b12+a22*b22+a23*b32+a24*b42;te[9]=a21*b13+a22*b23+a23*b33+a24*b43;te[13]=a21*b14+a22*b24+a23*b34+a24*b44;te[2]=a31*b11+a32*b21+a33*b31+a34*b41;te[6]=a31*b12+a32*b22+a33*b32+a34*b42;te[10]=a31*b13+a32*b23+a33*b33+a34*b43;te[14]=a31*b14+a32*b24+a33*b34+a34*b44;te[3]=a41*b11+a42*b21+a43*b31+a44*b41;te[7]=a41*b12+a42*b22+a43*b32+a44*b42;te[11]=a41*b13+a42*b23+a43*b33+a44*b43;te[15]=a41*b14+a42*b24+a43*b34+a44*b44;返回这个;},
