1. 程式人生 > >二維圖形的矩陣變換(一)——基本概念

二維圖形的矩陣變換(一)——基本概念

tcl aid 縮放 clas 數學家 hang matrix log css3

原文:二維圖形的矩陣變換(一)——基本概念

基本的二維變換可包括旋轉、縮放、扭曲,和平移四種,

技術分享圖片 技術分享圖片 技術分享圖片 技術分享圖片

而這些幾何運算則可以轉換為一些基本的矩陣運算:

技術分享圖片

這幾個變換都是線性的,但平移運算不是線性的,不能通過2*2矩陣運算完成。若要將點 (2, 1)在 x 方向將其平移 3 個單位,在 y 方向將其平移 4 個單位。 可通過先使用矩陣乘法再使用矩陣加法來完成此操作。

技術分享圖片

綜合這幾種基本運算,數學家們將其統一為一個3*3矩陣,存儲形式如下:

技術分享圖片

由於表示仿射變換的矩陣的第三列總是(0,0,1),在存儲矩陣的時候,大多只存成一個2*3的數組。

變換的原點

二維變換的參考點是非常重要的,例如如下旋轉的結果就大不相同:

技術分享圖片 技術分享圖片

當然,有一種特殊的變換除外。那就是平移變換,無論原點是什麽其變換的結果都是沒有變化的。

復合變換

復合變換的矩陣可通過將幾個單獨的變換矩陣相乘而得到,這就意味著任何仿射變換的序列均可存儲於單個的 Matrix 對象中。

技術分享圖片

需要註意的是,復合變換是有順序的,一般說來,先旋轉、再縮放、然後平移,與先縮放、再旋轉、然後平移是不同的。

逆矩陣

可以根據一定的運算求出某個矩陣的逆矩陣,這個矩陣可以用來求出新的坐標點在原坐標系的位置。但需要註意的是,並非所有矩陣都是可逆的,可逆矩陣要求是非奇異矩陣。

在線預覽

微軟有一個幾何變換的在線預覽的頁面,可以非常直觀的幫助我們理解這些變換,感興趣的朋友不妨試試。

http://ie.microsoft.com/testdrive/Graphics/hands-on-css3/hands-on_2d-transforms.htm

小結

矩陣運算其實是非常基礎的數學知識,在圖形學中應用得還是非常廣泛的,但大學學的時候往往不知道幹嘛用,現在用的時候卻又忘了啥原理了。本文這裏只是介紹了一些矩陣運算的基本概念,具體詳細的內容可以參考下下面的這些參考資料。下一篇文章再簡單的介紹一下矩陣變換的實際使用。

參考資料:

  1. http://msdn.microsoft.com/zh-cn/library/8667dchf(v=vs.110).aspx
  2. http://msdn.microsoft.com/zh-cn/library/ms750596(v=vs.110).aspx
  3. http://www.zhangxinxu.com/wordpress/2012/06/css3-transform-matrix-%E7%9F%A9%E9%98%B5/
  4. http://netclass.csu.edu.cn/NCourse/hep089/Chapter6/CG_Txt_6_011.htm
  5. http://www.zhangxinxu.com/wordpress/2012/06/css3-transform-matrix-%E7%9F%A9%E9%98%B5/

二維圖形的矩陣變換(一)——基本概念