提要
旋轉的表達方式有很多種，有尤拉角，旋轉矩陣，軸角，四元素等等，今天要學習的就是遊戲開發中最常用的四元素。
從尤拉角和軸向角到四元數
在講四元素之前，我們先來看下簡單的尤拉角和軸向角。
尤拉角使用最簡單的x,y,z值來分別表示在x，y，z軸上的旋轉角度，其取值為0-360(或者0-2pi），一般使用roll，pitch，yaw來表示這些分量的旋轉值。需要注意的是，這裡的旋轉是針對世界座標系說的，這意味著第一次的旋轉不會影響第
二、三次的轉軸。
尤拉角容易出現的問題是 1）不易在任意方向的旋轉軸插值； 2）萬向節死鎖；3）旋轉的次序無法確定。
軸角用乙個以單位向量定義的旋轉角，再加上乙個標量定義的旋轉角來表示旋轉。通常的表示[x,y,z,theta]，前面三個表示軸，最後乙個表示角度。表示非常直觀，也很緊湊。
軸角最大的乙個侷限就是不能進行簡單的插值，此外，軸角形式的旋轉不能直接施於點或向量，必轉換為矩陣或者四元素。
四元素感覺上就是軸角的進化，也是使用乙個3維向量表示轉軸和乙個角度分量表示繞此轉軸的旋轉角度，即(x,y,z,w)， 其中
w = cos(theta/2)
x = ax * sin(theta/2)
y = ay * sin(theta/2)
z = az * sin(theta/2)
其中(ax,ay,az)表示軸的向量，theta表示繞此軸的旋轉角度。四元數中的每個數都是經過「處理」的軸和角，軸角描述的「四元組」並不是乙個空間下的東西，首先（ax,ay,az）是乙個3維座標下的向量，而theta則是級座標下的角度，簡單的將他們組合到一起並不能保證他們插值結果的穩定性，因為他們無法歸一化，所以不能保證最終插值後得到的向量長度（經過旋轉變換後兩點之間的距離）相等，而四元數在是在乙個統一的4維空間中，方便歸一化來插值，又能方便的得到軸、角這樣用於3d影象的資訊資料，所以用四元數再合適不過了。相比於矩陣，四元素也只要儲存4個浮點數，優勢很明顯。
四元素的相關計算
乘法給定兩個四元數p和q，分別代表旋轉p和q，則乘積pq表示兩個旋轉的合成（即旋轉了q之後再旋轉p），並不是用加法。四元數的乘法定義如下，利用簡單的分配律就是了：
q1 * q2 =
(w1*w2 - x1*x2 - y1*y2 - z1*z2) +
(w1*x2 + x1*w2 + y1*z2 - z1*y2) i +
(w1*y2 - x1*z2 + y1*w2 + z1*x2) j +
(w1*z2 + x1*y2 - y1*x2 + z1*w2) k
由於q = w + x i + y j + z k中可以分為純量w與向量x i + y j + z k，所以為了方便表示，將q表示為(s, v)，其中s表示純量w，v表示向量x i + y j + z k，所以四元數乘法又可以表示為：
q1 * q2 = (s1 + v1)*(s2 + v2) = s1*s2 - v1.v2 + v1xv2 + s1*v2 + s2*v1
求模n(q) = |q| = x2 + y2 + z2 + w2
單位化normalize( q ) = q/ | q | = q / (x2 + y2 + z2 + w2)
求共軛q*=(-x, -y, -z, w)
求逆對於向量逆的定義, q-1 =q*/|q|2
對於單位四元素，分母為1，q-1 = q* =(-x, -y, -z, w)
用四元數旋轉向量
給定乙個向量v，再給定乙個旋轉的單位四元素q，讓v旋轉q。
首先將v改寫成四元素的形式v = (x, y ,z, 0), 接下來要旋轉v須用q前乘以向量v，再後乘以q-1。
v『 = qvq-1
當然用後面乘以共軛的q也是一樣的，因為都是單位四元素。
對於旋轉多個四元數，比如 r=r1r2r3. 則
注意順序。
四元數的線性插值和球面線性插值
四元素的可以方便地進行插值是四元素最大的優勢。線性插值最為簡單，效率也很高。給定兩個旋轉四元素qa和qb代表旋轉a和旋轉b，找到旋轉a到旋轉b之間的 t 的旋**
注意這裡的 t 實際上是是沿弦上走了t，而不是在球面上走t，這樣就會導致當 t 以恆定速度改變時，角度的變化並非恆定.
為了解決這個問題，就出現了球面線性插值。給定四元素q和q，
其中theta是兩個四元素的夾角，
四元數的各種轉換
四元素轉尤拉角
尤拉角轉四元素
四元素轉旋轉矩陣
matrix4x4(
1.0f - 2.0f*y*y - 2.0f*z*z, 2.0f*x*y - 2.0f*z*w, 2.0f*x*z + 2.0f*y*w, 0.0f,
2.0f*x*y + 2.0f*z*w, 1.0f - 2.0f*x*x - 2.0f*z*z, 2.0f*y*z - 2.0f*x*w, 0.0f,
2.0f*x*z - 2.0f*y*w, 2.0f*y*z + 2.0f*x*w, 1.0f - 2.0f*x*x - 2.0f*y*y, 0.0f,
0.0f, 0.0f, 0.0f, 1.0f)參考
遊戲引擎架構 第四章
computer graphics: 四元數與旋轉 -
quaternion(四元數)和旋轉以及yaw, pitch, roll 的含義 - -
徹底搞懂px em rem
px畫素 pixel 相對長度單位。畫素px是相對於顯示器螢幕解析度而言的。px特點 em是相對長度單位。相對於當前物件內文字的字型尺寸。如當前對行內文字的字型尺寸未被人為設定，則相對於瀏覽器的預設字型尺寸。em特點 注意 任意瀏覽器的預設字型高都是16px。所有未經調整的瀏覽器都符合 1em 16...
徹底搞懂parseInt
parseint 72.45 8 2 8 1 7 8 1 4 8 1 5 8 2 2 1 7 8 4 1 8 5 1 8 8 58.578125 parseint 231 3 3進製只能是0 2，所以查詢到3的時候，發現已經不是3進製的範疇了，則不再繼續查詢 把2當做3進製，最後轉為10進製 2 3...
徹底搞懂js proto
在開始之前，必須要知道的是 物件具有 proto constructor 函式也是物件固也具有以上 屬性，而函式獨有prototype 在看到一張圖分析到位很徹底，這裡共享 剛開始看這圖很懵，根本看不懂，但是細品，多品後恍然大悟，然後總結出以下幾點，很重要切記 1 切記 物件的內建屬性 proto ...