threejs中矩陣旋轉原理

建立乙個立方體cube放到場景中；

繞向量(1,1,0)旋轉30度

var axis = new three.vector3(1,1,0);    //建立乙個三維向量

var rotworldmatrix = new three.matrix4(); //建立乙個4*4矩陣
rotworldmatrix.makerotationaxis(axis.normalize(), 30 * math.pi / 180 );
rotworldmatrix.multiply(cube.matrix); // pre-multiply
cube.matrix = rotworldmatrix;
cube.rotation.setfromrotationmatrix(cube.matrix);

**詳解

建立乙個三維空間中的點

var axis = new three.vector3(1,1,0);

axis.normalize()  //返回乙個向量，其方向與指定向量相同，但長度為一。

如：var axis = new three.vector3(10,20,0);
console.log( axis.normalize() )； //
(0.4472135954999579^2)+(0.8944271909999159^2)+(0^2) = 1
var axis1 = new three.vector3(1,1,0);
console.log( axis1.normalize() ) //
(0.7071067811865475^2)+(0.7071067811865475^2)+(0^2) = 1

var rotworldmatrix = new three.matrix4();

將上面建立的4×4矩陣按照傳入的軸旋轉傳入的弧度
rotworldmatrix.makerotationaxis( 旋轉軸，旋轉弧度 )
//matrix4原型上的方法

//axis = axis.normalize() 值為 
//angle = 30 * math.pi / 180 值為 pi/6
makerotationaxis: function ( axis, angle ) ,
rotworldmatrix.makerotationaxis(axis.normalize(), 30 * math.pi / 180 );

rotworldmatrix初始值為
執行makerotationaxis()之後的值為：
將按照旋轉軸和弧度旋轉完成的矩陣和幾何體的矩陣相乘
rotworldmatrix.multiply(cube.matrix);
//框架原始碼

multiply: function ( m, n ) 
return this.multiplymatrices( this, m );
},multiplymatrices: function ( a, b ) ,
 
openGL矩陣複習 旋轉矩陣的原理
以繞x軸旋轉為例 很明顯,繞x軸旋轉,x值是不會變化的,所以矩陣第一行是和單位矩陣一樣的.繞x軸旋轉,實際上就是在下圖的座標系裡面旋轉乙個二維向量.從紅色向量旋轉到綠色向量.通常我們以 x,y 這種形式來表示向量,但在旋轉向量這裡,使用三角函式來表示,更加容易理解,也更方便計算.紅色向量用三角函式表...
ThreeJS中CameraHelper的使用
參考 想達到這種效果,都必須使用2個相機。就如上圖2所示,螢幕相機的投影是整個螢幕 左右兩個小視窗共同組成 帶相機助手的投影是左面的畫面。偽 螢幕相機 let camera newthree.perspectivecamera 45 1,0.01 300 camera.position.set 1 ...
矩陣運算 矩陣旋轉
以下不加證明地給出在世界座標系中，以座標點 0，0，0 為原點的旋轉矩陣 包含平移的線性變換稱作仿射變換，3d中的仿射變換不能用 3 x 3 矩陣表達，必須使用4 x 4矩陣 1.繞x座標軸旋轉 1 0 0 0 0 cos a sin a 0 0 sin a cos a 0 0 0 0 1 2.繞y...