[WebGL入門]五,矩陣的基礎知識
注:文章譯自http://wgld.org/,原作者杉本雅広(doxas),文章中如果有我的額外說明,我會加上[lufy:],另外,鄙人webgl研究還不夠深入,一些專業詞語,如果翻譯有誤,歡迎大家指正。
不是讓你到店前面排隊
lufy:你一定奇怪,為什麼叫這個題目,因為日語中的矩陣叫做“行列”,所以作者就給讀者們開了個玩笑,我就這麼直接翻譯了,大家知道什麼意思就行了。
在3D渲染的世界裡,會很頻繁的用到矩陣。
這裡所說的矩陣,是數學裡的矩陣。英語中叫做Matrix。
矩陣雖然聽起來好像很簡單,矩陣也有很多種,而且計算方法非常難或者說非常麻煩。簡單的說,矩陣就是把數字像箱子一樣排列,將數字橫豎排列起來就形成了矩陣。在平常的生活中是用不到的,但是在3D渲染的世界中卻是不可缺少的一個元素。
為什麼需要矩陣
雖然說矩陣在3D渲染中不可缺少,但是可能完全沒有接觸過它的人也不在少數。那為什麼矩陣如此重要呢?
模擬三維空間,需要非常多的計算。什麼樣的東西,在哪裡,什麼角度,大小如何,只繪製想要繪製的模型數等等,都需要進行非常複雜且大量的計算。
矩陣就是像剛才說的那樣,把數字按照行和列排列起來,在實際應用中,一個矩陣中可以包含很多的情報。
比如說,想要繪製的模型在世界的什麼位置放置著,是否發生了旋轉,是否進行了放大和縮小,攝影的鏡頭在什麼位置,鏡頭的方向如何,最終成像後的畫面的橫豎比例如何......等等,這些情報都可以用一個矩陣來表示。
如果你看了前面的文章(三,3D繪圖的基礎知識),並且你是個細心的人的話,應該注意到了吧,模型在世界的什麼位置,鏡頭的方向等,前面都已經介紹過了。
也就是說,模型座標變換,檢視座標變換,投影座標變換,這些一連串的座標變換如果使用矩陣的話,就可以在一個矩陣中完成所有的座標變換處理。不管怎麼說,為什麼矩陣這麼重要,大家應該大概瞭解了吧。主要是,矩陣的計算效率很高,而且及其便利。
3D渲染和矩陣
上面說矩陣是由數字組合起來的,那麼矩陣到底是個什麼東西呢?
矩陣雖然有很多種,其中的一種叫做方陣。就是行數和列數相同的矩陣。
上面這樣的矩陣,就叫做方陣。
這樣的方陣,一般的3D渲染的世界中使用的是4x4的矩陣。就像剛剛給的圖一樣,行和列都是4個元素組成,這就是3D渲染中使用的矩陣的型別。
那為什麼不是3x3的方陣或者其他的矩陣,而偏偏是4x4的方陣,這是有原因的。不過,現在先不用在意這些。只要先記住,矩陣是能夠讓3D渲染中的計算變的簡單的一個機制就行了。
矩陣完全是數學的話題,所以理解起來可能非常的難。雖然說,最好是仔細的學一下,但是現在的階段,只需要知道矩陣是個什麼東西就可以了。*實際上,我也不是數學專業,也不可能對矩陣的每一個細節都完全理解。
實際3D渲染的時候,像上面說的那樣,準備好模型座標變換,檢視座標變換,投影座標變換的各個矩陣。再具體一點,就是準備好各種座標變換的矩陣,然後相乘。將最終得到的矩陣傳給WebGL的頂點著色器。
頂點著色器從傳過來的矩陣中,獲取到模型的座標,加工到畫面上顯示出來。也就是說,操作座標變換的矩陣,就可以決定模型在畫面上如何繪製。
矩陣能做什麼
前面也說了,座標變換有模型變換,檢視變換,投影變換等多種。
矩陣可以將上面提到的變換儲存起來,比如,如果是模型變換的矩陣,想要繪製的3D模型的位置,擴大縮小,以及旋轉等資訊,都可以定義在一個矩陣中。檢視變換矩陣,鏡頭的位置,鏡頭的方向,以及鏡頭對準了哪個點(注視點)等可以定義在一個矩陣中。投影變換矩陣的話,顯示的橫豎比例和視角等資訊可以定義在一個矩陣中。
而且,這三個矩陣可以相互組合,最終得出的變換矩陣傳給著色器,但是這裡需要注意一點,如果是普通的數學計算,相乘的時候,不需要注意相乘的順序,比如2x3等於6,3x2也等於6。但是矩陣的話,根據相乘的順序得出的結果是不同的。因為矩陣的這種性質,所以進行模型,檢視,投影的矩陣相乘的時候,要特別注意相乘的順序。
到實際寫程式的時候,我會進一步詳細說明,首先要記住矩陣相乘的順序非常的重要。
總結
好了,說了這麼多,對矩陣也多少有些瞭解了吧。
這次,不是讓你完全理解矩陣,就是先介紹一下,如果要真的講解矩陣的話,你必須一個腳踩進數學世界的大門才行。
進行3D渲染,矩陣是不可缺少的,而且要徹底理解矩陣是非常難的。所以現在先明白一下矩陣到底是個什麼東西就行了。
以後,我有可能會專門進行矩陣的講解,首先,簡單理解一下就好。重要的是,比起零基礎,先來知道一下矩陣的用處。如果有興趣的話,網上有很多相關的介紹,理解的越深肯定越好。如果有時間的話,可以先自己看一下。
下一次,介紹一下3D中的術語頂點和多邊形。
相關文章
- [WebGL入門]三,3D繪圖的基礎知識Web3D繪圖
- OpenGL/OpenGL ES 入門:基礎變換 - 初識向量/矩陣矩陣
- JavaScript 基礎知識入門JavaScript
- MySql入門--基礎知識MySql
- css 入門基礎知識CSS
- [WebGL入門]十,矩陣計算和外部庫Web矩陣
- JavaScript入門①-基礎知識築基JavaScript
- sql入門基礎知識分享SQL
- Dubbo基礎入門知識點
- Java基礎知識入門-JDKJavaJDK
- Java入門基礎知識點Java
- Python類的基礎入門知識Python
- Python入門必知的知識點!Python基礎入門Python
- Linux驅動入門基礎基礎知識Linux
- Python基礎知識入門(二)Python
- Python入門基礎知識(二)Python
- 【LaTeX入門】01、LaTeX基礎知識
- oracle架構的基礎知識(入門級)Oracle架構
- OpenSSL 入門:密碼學基礎知識密碼學
- Python入門基礎知識例項,Python
- Python入門之基礎知識(一)Python
- WebSocket系列之基礎知識入門篇Web
- JavaSE基礎知識分享(五)Java
- [WebGL入門]十三,minMatrix.js和座標變換矩陣WebJS矩陣
- [WebGL入門]九,頂點快取的基礎Web快取
- Android NDK入門:C++ 基礎知識AndroidC++
- 爬蟲開發知識入門基礎(1)爬蟲
- Python 基礎(一):入門必備知識Python
- Python入門基礎知識學什麼?Python
- Python快速入門之基礎知識(一)Python
- Altium Designer 20 入門基礎知識(5)
- Altium Designer 20 入門基礎知識(1)
- oracle spatial 基礎知識之五Oracle
- [WebGL入門]八,著色器的說明和基礎Web
- [基礎入門]網路安全知識問答(二)!
- Pwn入門筆記(二)a little棧基礎知識筆記
- 系統架構基礎知識入門指南-下架構
- 系統架構基礎知識入門指南-上架構