1. 從“點”到“世界”二維坐標(biāo)變換的基石地位如果你接觸過任何圖形、圖像處理或者玩過游戲、做過UI設(shè)計甚至只是簡單地用PPT拖拽過圖片那么你已經(jīng)在不知不覺中使用了二維坐標(biāo)變換。它不像深度學(xué)習(xí)那樣充滿神秘感也不像底層算法那樣考驗智力但它卻是構(gòu)建數(shù)字視覺世界的磚瓦。一個點從屏幕左上角移動到右下角一張圖片旋轉(zhuǎn)90度一個圖標(biāo)放大兩倍背后都是一套簡潔而強大的數(shù)學(xué)在默默支撐。今天我們不談高深的理論就從最實用的角度拆解二維坐標(biāo)的五大基本操作平移、旋轉(zhuǎn)、縮放、鏡像和陣列。理解它們你就能看透很多圖形操作的本質(zhì)無論是用OpenCV處理圖像用Canvas繪制動畫還是在游戲引擎里擺放物體都能做到心中有數(shù)。這五大變換是計算機圖形學(xué)的“普通話”。平移決定了物體在哪里旋轉(zhuǎn)決定了物體面朝何方縮放決定了物體的大小鏡像提供了對稱的視圖而陣列則是高效復(fù)制的利器。它們單獨使用可以完成基礎(chǔ)操作組合起來則能創(chuàng)造出復(fù)雜的運動與形變。很多朋友在初次接觸時可能會被矩陣、齊次坐標(biāo)這些概念嚇到覺得這是數(shù)學(xué)家的領(lǐng)域。但我想說從工程和使用的角度出發(fā)我們可以先掌握“怎么用”再慢慢理解“為什么”這樣學(xué)習(xí)路徑會平滑很多。本文的目標(biāo)就是讓你在讀完以后不僅能手動計算出坐標(biāo)變換的結(jié)果更能理解在代碼中比如用Python的NumPy或OpenCV如何高效實現(xiàn)并避開一些常見的“坑”。2. 坐標(biāo)系與點的表示一切開始的地方在開始變換之前我們必須統(tǒng)一“語言”也就是坐標(biāo)系。在二維空間中我們最常用的是笛卡爾坐標(biāo)系。但需要注意的是在計算機圖形學(xué)中存在兩個常見的Y軸方向約定。2.1 兩種常見的坐標(biāo)系約定第一種是數(shù)學(xué)坐標(biāo)系也叫世界坐標(biāo)系。它的原點通常在中心X軸向右為正Y軸向上為正。這是我們從小在數(shù)學(xué)課本里學(xué)到的標(biāo)準(zhǔn)坐標(biāo)系。第二種是屏幕坐標(biāo)系或圖像坐標(biāo)系這在UI、網(wǎng)頁和許多圖像處理庫中更常見。它的原點在左上角X軸仍然向右為正但Y軸向下為正。這一點至關(guān)重要很多初學(xué)者在實現(xiàn)旋轉(zhuǎn)時結(jié)果不對根源就在于混淆了Y軸方向。注意本文后續(xù)的公式推導(dǎo)和示例如無特別說明均基于數(shù)學(xué)坐標(biāo)系Y軸向上。當(dāng)應(yīng)用到屏幕坐標(biāo)系時需要對Y坐標(biāo)或旋轉(zhuǎn)角度進行相應(yīng)調(diào)整通常是將Y坐標(biāo)取反或旋轉(zhuǎn)角度取反。一個二維點P可以用坐標(biāo)(x, y)來表示。在計算中我們通常將其視為一個列向量P [x, y]^T^T表示轉(zhuǎn)置即豎著寫的向量。使用向量和矩陣是高效處理坐標(biāo)變換的關(guān)鍵。2.2 為什么是齊次坐標(biāo)細心的你可能會發(fā)現(xiàn)平移變換(xdx, ydy)無法像旋轉(zhuǎn)縮放那樣寫成矩陣 * [x, y]^T的統(tǒng)一形式。為了用統(tǒng)一的矩陣乘法來處理所有變換包括平移我們引入了齊次坐標(biāo)。齊次坐標(biāo)給二維點增加了一個維度變成(x, y, w)。通常我們令w1所以一個點就表示為[x, y, 1]^T。這樣平移、旋轉(zhuǎn)、縮放都可以通過一個3x3的變換矩陣相乘來完成極大地簡化了復(fù)合變換的計算連續(xù)變換只需連乘矩陣即可。這是圖形學(xué)中的一個經(jīng)典技巧務(wù)必理解其動機。3. 五大基礎(chǔ)變換的數(shù)學(xué)原理與矩陣表示現(xiàn)在讓我們逐一剖析這五種基本變換。我會給出直觀理解、數(shù)學(xué)公式、齊次坐標(biāo)下的變換矩陣并附上易于理解的解釋。3.1 平移改變位置平移是最直觀的變換。將點P(x, y)沿X軸移動tx沿Y軸移動ty得到新點P(x, y)。 公式非常簡單x x txy y ty在齊次坐標(biāo)下平移矩陣T為T | 1 0 tx | | 0 1 ty | | 0 0 1 |計算過程為P T * P即[x, y, 1]^T T * [x, y, 1]^T。 展開后就是x 1*x 0*y tx*1 x txy 0*x 1*y ty*1 y ty完美對應(yīng)。實操心得在代碼中平移就是加法。但當(dāng)你需要將平移與其他變換組合時比如先旋轉(zhuǎn)再平移使用矩陣乘法是唯一高效且正確的方式。單獨處理平移時直接加減坐標(biāo)是最快的。3.2 旋轉(zhuǎn)改變朝向旋轉(zhuǎn)指定一個點繞坐標(biāo)系原點逆時針旋轉(zhuǎn) θ 角度。這是變化最豐富也最容易出錯的變換。繞原點逆時針旋轉(zhuǎn) θ 角度的公式為x x*cosθ - y*sinθy x*sinθ y*cosθ這個公式怎么來的我們可以把點P看作一個向量其長度為r與X軸夾角為φ。那么x r*cosφ,y r*sinφ。旋轉(zhuǎn)θ后新夾角為φθ所以x r*cos(φθ) r*(cosφcosθ - sinφsinθ) x*cosθ - y*sinθ。y的推導(dǎo)類似。在齊次坐標(biāo)下旋轉(zhuǎn)矩陣R為R | cosθ -sinθ 0 | | sinθ cosθ 0 | | 0 0 1 |關(guān)鍵陷阱與解決方案旋轉(zhuǎn)中心上述矩陣默認(rèn)繞原點旋轉(zhuǎn)。如果你想繞任意點(cx, cy)旋轉(zhuǎn)步驟是a) 平移物體使旋轉(zhuǎn)中心移至原點(T1)b) 繞原點旋轉(zhuǎn)(R)c) 平移回原位置(T2)。復(fù)合矩陣為M T2 * R * T1。這個順序非常重要矩陣乘法不滿足交換律角度方向公式基于逆時針為正。在屏幕坐標(biāo)系Y軸向下中視覺上的“順時針”旋轉(zhuǎn)才是數(shù)學(xué)上的“逆時針”旋轉(zhuǎn)。所以如果你在Canvas或OpenCV中想讓圖像順時針旋轉(zhuǎn)90度傳入的角度應(yīng)該是-90°或-π/2弧度。精度問題sin和cos計算涉及浮點數(shù)。對于90°、180°等特殊角度直接使用0,1,-1賦值避免不必要的計算誤差。3.3 縮放改變大小縮放關(guān)于原點進行。將點P的X坐標(biāo)乘以系數(shù)sxY坐標(biāo)乘以系數(shù)sy。 公式x sx * xy sy * y。齊次坐標(biāo)下的縮放矩陣SS | sx 0 0 | | 0 sy 0 | | 0 0 1 |深度解析等比縮放當(dāng)sx sy時物體等比例放大或縮小形狀不變。非等比縮放當(dāng)sx ! sy時物體會被拉伸或壓扁。例如sx2, sy1物體在X方向拉長為2倍Y方向不變。縮放中心與旋轉(zhuǎn)類似默認(rèn)關(guān)于原點縮放。如果想關(guān)于點(cx, cy)縮放同樣需要“平移-縮放-平移”三步M T2 * S * T1。負值縮放縮放系數(shù)可以為負。sx -1, sy 1的效果等同于關(guān)于Y軸的鏡像后面會講到。這是一種非常巧妙的統(tǒng)一。3.4 鏡像創(chuàng)造對稱鏡像是縮放的一種特殊形式即縮放系數(shù)為負。它創(chuàng)建物體的對稱像。關(guān)于Y軸鏡像垂直軸相當(dāng)于X坐標(biāo)取反Y坐標(biāo)不變。變換為x -xy y。其矩陣是縮放系數(shù)為sx-1, sy1的縮放矩陣。關(guān)于X軸鏡像水平軸相當(dāng)于X坐標(biāo)不變Y坐標(biāo)取反。變換為x xy -y。其矩陣是縮放系數(shù)為sx1, sy-1的縮放矩陣。關(guān)于原點鏡像X, Y坐標(biāo)均取反。變換為x -xy -y。這等價于旋轉(zhuǎn)180度。其矩陣是縮放系數(shù)為sx-1, sy-1的縮放矩陣。關(guān)于任意直線的鏡像這比關(guān)于坐標(biāo)軸的鏡像復(fù)雜但原理相通。假設(shè)鏡像軸為直線Ax By C 0。實現(xiàn)步驟通常是平移直線使其過原點消除C。旋轉(zhuǎn)坐標(biāo)系使新X軸與該直線重合。在新坐標(biāo)系下執(zhí)行關(guān)于X軸的鏡像即Y坐標(biāo)取反。旋轉(zhuǎn)回原角度。平移回原位。 這個過程清晰地展示了如何通過基本變換的組合來實現(xiàn)復(fù)雜變換。3.5 陣列模式的復(fù)制陣列本身不是一個“基本”的線性變換而是平移變換的重復(fù)應(yīng)用。它的核心思想是根據(jù)一個基礎(chǔ)物體或點通過規(guī)律性的平移有時結(jié)合旋轉(zhuǎn)和縮放生成一系列副本。常見的陣列模式線性陣列沿一條直線等間距復(fù)制。假設(shè)基礎(chǔ)點P0方向向量(dx, dy)數(shù)量n。則第i個點的位置為P_i P0 i * (dx, dy)其中i 0, 1, ..., n-1。這本質(zhì)上是重復(fù)了n-1次平移變換。矩形陣列網(wǎng)格在X和Y兩個方向上進行線性陣列。通常先定義行間距和列間距。生成時使用兩層循環(huán)。環(huán)形陣列極坐標(biāo)陣列繞一個中心點等角度旋轉(zhuǎn)復(fù)制。對于第i個副本其變換是先旋轉(zhuǎn)i * Δθ角度再從中心點平移出一定半徑距離。注意這里的“旋轉(zhuǎn)”和“平移”順序很重要。通常我們先在中心點旁邊創(chuàng)建一個物體然后將其旋轉(zhuǎn)到指定角度最后再平移到環(huán)形軌跡上。用矩陣表示就是M_i T(center) * R(i*Δθ) * T(-offset)其中offset是物體相對于旋轉(zhuǎn)中心的初始偏移。陣列的工程價值在CAD設(shè)計如SolidWorks孔陣列、游戲場景布置如擺放一排樹木、UI界面生成如按鈕列表中陣列是提高效率的核心工具。自己實現(xiàn)陣列邏輯的關(guān)鍵在于分離“單個實例的變換計算”和“循環(huán)生成邏輯”。4. 變換的組合、順序與矩陣乘法單個變換威力有限真正的力量來自于組合。比如我們希望一個圖形先縮放2倍再旋轉(zhuǎn)30度最后平移到(100, 100)。4.1 順序至關(guān)重要從右向左的乘法變換矩陣M作用于點P是P M * P。如果有多個變換例如先應(yīng)用矩陣A再應(yīng)用矩陣B最后應(yīng)用矩陣C那么復(fù)合矩陣M C * B * A。注意順序是從右向左最后一個變換C乘在最左邊。為什么因為P C * (B * (A * P)) (C * B * A) * P。矩陣乘法滿足結(jié)合律但不滿足交換律。先旋轉(zhuǎn)后平移和先平移后旋轉(zhuǎn)的結(jié)果是天差地別的。先旋轉(zhuǎn)后平移物體繞自身中心旋轉(zhuǎn)后再移動到某個位置。這是最常見的需求比如一個車輪先轉(zhuǎn)起來再放到車軸上。先平移后旋轉(zhuǎn)物體先被移動到某處然后繞坐標(biāo)系原點旋轉(zhuǎn)。這通常會導(dǎo)致物體飛出去繞原點“公轉(zhuǎn)”而不是繞自身“自轉(zhuǎn)”。一個記憶技巧把變換矩陣看作是對坐標(biāo)系的操作指令列表從右往左讀。M T * R * S意味著“先縮放(S)本地坐標(biāo)系然后旋轉(zhuǎn)(R)這個已縮放的坐標(biāo)系最后平移(T)這個已縮放且旋轉(zhuǎn)的坐標(biāo)系”。物體是固定在這個被變換的坐標(biāo)系中的。4.2 復(fù)合變換的通用計算框架對于任何復(fù)雜的變換需求都可以遵循以下步驟構(gòu)建復(fù)合矩陣確定變換中心如果不是原點先構(gòu)建平移矩陣T(-cx, -cy)將中心移至原點。按順序應(yīng)用核心變換例如縮放S(sx, sy) 旋轉(zhuǎn)R(θ)。這些變換是相對于當(dāng)前坐標(biāo)系此時中心已在原點進行的。將中心移回應(yīng)用平移矩陣T(cx, cy)將坐標(biāo)系移回。連乘矩陣M T(cx, cy) * R(θ) * S(sx, sy) * T(-cx, -cy)。這個框架是萬能的。無論變換多復(fù)雜拆解成“移至原點-執(zhí)行操作-移回”的組合總能解決。5. 在代碼中實現(xiàn)Python與OpenCV實戰(zhàn)理論說再多不如一行代碼。我們以Python和OpenCV為例看看如何實操。OpenCV的仿射變換函數(shù)cv2.warpAffine正是基于這些2x3的變換矩陣是3x3齊次矩陣的前兩行。5.1 使用NumPy構(gòu)建變換矩陣我們先實現(xiàn)一個繞任意點旋轉(zhuǎn)的函數(shù)來演示矩陣乘法的威力。import numpy as np import cv2 import math def get_rotation_matrix(center, angle, scale1.0): 生成繞任意點旋轉(zhuǎn)的變換矩陣2x3用于OpenCV。 Args: center: 旋轉(zhuǎn)中心 (cx, cy) angle: 旋轉(zhuǎn)角度度順時針為正符合OpenCV習(xí)慣 scale: 縮放比例 Returns: M: 2x3 仿射變換矩陣 # 將角度轉(zhuǎn)換為弧度并轉(zhuǎn)換為逆時針數(shù)學(xué)標(biāo)準(zhǔn) # 因為OpenCV的warpAffine內(nèi)部使用數(shù)學(xué)坐標(biāo)系邏輯但圖像Y軸向下 # 所以這里我們直接按數(shù)學(xué)公式計算傳入的角度取負以實現(xiàn)視覺上的順時針。 angle_rad math.radians(-angle) alpha scale * math.cos(angle_rad) beta scale * math.sin(angle_rad) cx, cy center # 構(gòu)建旋轉(zhuǎn)縮放部分 (2x2) # 這是繞原點的旋轉(zhuǎn)縮放矩陣 R S * R # R [[cos, -sin], [sin, cos]] # 所以 R [[scale*cos, -scale*sin], [scale*sin, scale*cos]] # 即 [[alpha, -beta], [beta, alpha]] # 構(gòu)建完整的2x3仿射矩陣 [R | t] # t center - R * center tx cx - alpha * cx beta * cy ty cy - beta * cx - alpha * cy M np.array([[alpha, -beta, tx], [beta, alpha, ty]], dtypenp.float32) return M # 使用示例 img cv2.imread(input.jpg) height, width img.shape[:2] center (width // 2, height // 2) # 繞圖像中心旋轉(zhuǎn) angle 45 # 順時針旋轉(zhuǎn)45度 scale 0.8 # 同時縮小到0.8倍 M get_rotation_matrix(center, angle, scale) # 執(zhí)行變換第三個參數(shù)是輸出圖像尺寸 rotated_img cv2.warpAffine(img, M, (width, height)) cv2.imshow(Rotated and Scaled, rotated_img) cv2.waitKey(0)這段代碼的關(guān)鍵在于計算平移量tx, ty。它直接實現(xiàn)了M T(center) * (S*R) * T(-center)這個復(fù)合變換中關(guān)于平移部分的合并計算。tx cx - (alpha*cx - beta*cy)ty cy - (beta*cx alpha*cy)。5.2 實現(xiàn)一個簡單的陣列生成器假設(shè)我們有一張小圖標(biāo)icon想在畫布canvas上生成一個3x4的網(wǎng)格陣列。def draw_array(canvas, icon, start_pos, rows, cols, dx, dy): 在畫布上繪制圖標(biāo)陣列。 Args: canvas: 背景畫布圖像 (numpy array) icon: 圖標(biāo)圖像 (numpy array) start_pos: 起始位置 (x, y) rows: 行數(shù) cols: 列數(shù) dx: 列間距水平方向 dy: 行間距垂直方向 icon_h, icon_w icon.shape[:2] start_x, start_y start_pos for r in range(rows): for c in range(cols): # 計算當(dāng)前圖標(biāo)左上角的位置 pos_x start_x c * dx pos_y start_y r * dy # 確保位置在畫布范圍內(nèi) if 0 pos_x canvas.shape[1] and 0 pos_y canvas.shape[0]: # 計算圖標(biāo)在畫布中的覆蓋區(qū)域 end_x min(pos_x icon_w, canvas.shape[1]) end_y min(pos_y icon_h, canvas.shape[0]) # 計算圖標(biāo)中實際可用于覆蓋的部分 icon_end_x icon_w if end_x pos_x icon_w else end_x - pos_x icon_end_y icon_h if end_y pos_y icon_h else end_y - pos_y if icon_end_x 0 and icon_end_y 0: # 將圖標(biāo)的一部分復(fù)制到畫布上 canvas[pos_y:end_y, pos_x:end_x] icon[:icon_end_y, :icon_end_x] # 使用示例 canvas np.zeros((400, 600, 3), dtypenp.uint8) # 創(chuàng)建黑色背景 canvas[:] (50, 50, 100) # 填充為深藍色 icon cv2.imread(small_icon.png) # 讀取圖標(biāo) draw_array(canvas, icon, start_pos(50, 50), rows3, cols4, dx120, dy100) cv2.imshow(Icon Array, canvas) cv2.waitKey(0)這個例子展示了陣列最核心的思想循環(huán)偏移計算。在實際的圖形庫或游戲引擎中陣列的實現(xiàn)會更高效比如使用實例化渲染但底層邏輯與此一致。6. 常見“坑點”與性能優(yōu)化經(jīng)驗談?wù)莆樟嗽砗突A(chǔ)代碼我們再來聊聊實踐中容易遇到的問題和優(yōu)化技巧。6.1 圖像旋轉(zhuǎn)時的黑邊與插值當(dāng)你用cv2.warpAffine旋轉(zhuǎn)一幅矩形圖像時輸出圖像的畫布大小如果和輸入一樣角落部分必然被裁剪。如果想保留全部內(nèi)容需要計算新的畫布大小。def rotate_bound(image, angle): 旋轉(zhuǎn)圖像但不裁剪內(nèi)容 (h, w) image.shape[:2] (cX, cY) (w // 2, h // 2) # 計算旋轉(zhuǎn)后能包含整個圖像的新邊界尺寸 cos np.abs(np.cos(np.radians(angle))) sin np.abs(np.sin(np.radians(angle))) nW int((h * sin) (w * cos)) nH int((h * cos) (w * sin)) # 調(diào)整旋轉(zhuǎn)中心到新圖像的中心 M cv2.getRotationMatrix2D((cX, cY), -angle, 1.0) M[0, 2] (nW / 2) - cX M[1, 2] (nH / 2) - cY # 執(zhí)行旋轉(zhuǎn) return cv2.warpAffine(image, M, (nW, nH), flagscv2.INTER_LINEAR)另外cv2.warpAffine中的flags參數(shù)指定了插值方法。cv2.INTER_NEAREST是最近鄰插值速度快但有鋸齒。cv2.INTER_LINEAR是雙線性插值效果和速度平衡最常用。cv2.INTER_CUBIC或cv2.INTER_LANCZOS4效果更好但更慢。對于縮小圖像建議使用cv2.INTER_AREA。6.2 變換的累加與增量更新在動畫或交互應(yīng)用中我們經(jīng)常需要基于上一幀的狀態(tài)進行增量變換比如每幀旋轉(zhuǎn)1度。錯誤的做法是每一幀都從原始狀態(tài)重新計算旋轉(zhuǎn)了n度的矩陣。正確的做法是維護一個當(dāng)前變換矩陣M_current每一幀應(yīng)用一個小的增量變換矩陣M_deltaM_current M_delta * M_current。注意順序新的增量變換應(yīng)該乘在左邊因為它要作用于當(dāng)前狀態(tài)之上。6.3 矩陣求逆從變換后坐標(biāo)反推原始坐標(biāo)有時我們需要知道變換后的某個點P對應(yīng)原始圖像中的哪個點P。這需要用到變換矩陣M的逆矩陣M_inv。因為P M * P所以P M_inv * P。對于剛體變換僅平移旋轉(zhuǎn)無縮放錯切其逆矩陣很容易求轉(zhuǎn)置旋轉(zhuǎn)部分取反平移向量。對于包含縮放的變換只要矩陣可逆縮放因子不為0就可以用np.linalg.inv計算。這在圖像配準(zhǔn)、鼠標(biāo)點選等場景中非常有用。6.4 性能考量矩陣運算與批量處理當(dāng)需要對成千上萬個點進行相同的變換時逐點計算效率極低。正確的做法是將所有點坐標(biāo)堆疊成一個N x 2的矩陣或N x 3的齊次坐標(biāo)矩陣然后與變換矩陣進行一次矩陣乘法。NumPy對此有極度優(yōu)化的實現(xiàn)比循環(huán)快幾個數(shù)量級。# 假設(shè)有N個點形狀為 (N, 2) points np.array([[x1, y1], [x2, y2], ..., [xn, yn]]) # 轉(zhuǎn)換為齊次坐標(biāo) (N, 3) points_homo np.hstack([points, np.ones((len(points), 1))]) # 定義3x3變換矩陣M M np.array([[..., ..., ...], [..., ..., ...], [..., ..., ...]]) # 批量變換 (N, 3) (N, 3) (3, 3).T 注意矩陣乘法的維度 transformed_points_homo (M points_homo.T).T # 轉(zhuǎn)換回2D坐標(biāo) transformed_points transformed_points_homo[:, :2] / transformed_points_homo[:, 2:]這種向量化操作是科學(xué)計算庫的核心優(yōu)勢務(wù)必掌握。7. 從二維到三維的思維延伸雖然本文聚焦二維但理解了二維變換就握住了打開三維圖形世界大門的鑰匙。三維變換同樣是平移、旋轉(zhuǎn)、縮放只是矩陣從3x3變成了4x4三維齊次坐標(biāo)。三維旋轉(zhuǎn)更復(fù)雜一些圍繞X、Y、Z軸或任意軸但核心思想不變用矩陣表示變換用矩陣乘法組合變換。例如在3D建模或機器人學(xué)中提到的“手眼標(biāo)定”其核心問題之一就是求解一個坐標(biāo)系到另一個坐標(biāo)系的變換矩陣包含旋轉(zhuǎn)和平移。這個矩陣就是我們在二維中討論的旋轉(zhuǎn)平移矩陣在三維空間的推廣。理解二維中“繞點旋轉(zhuǎn)”需要“平移-旋轉(zhuǎn)-平移”的組合就能類比理解三維中“繞軸旋轉(zhuǎn)”也需要類似的坐標(biāo)系對齊操作。再比如網(wǎng)絡(luò)熱詞中提到的“法蘭只平移無旋轉(zhuǎn)”描述的是一個機械部件法蘭盤只有位置移動沒有姿態(tài)變化。這在變換矩陣中體現(xiàn)為一個單位旋轉(zhuǎn)矩陣無旋轉(zhuǎn)加上一個平移向量。這種對運動模式的分解正是通過分析變換矩陣的結(jié)構(gòu)來實現(xiàn)的。二維坐標(biāo)變換是計算機圖形學(xué)、圖像處理、機器人運動學(xué)等眾多領(lǐng)域的基石。它并不復(fù)雜但要求精確和清晰的概念。我的建議是不要死記硬背公式而是動手寫代碼可視化每一個變換步驟的結(jié)果。用一個小方塊或三角形作為測試對象觀察它平移、旋轉(zhuǎn)、縮放后的位置并嘗試組合它們。當(dāng)你能夠準(zhǔn)確預(yù)測并實現(xiàn)屏幕上每一個像素的移動軌跡時這些知識才真正屬于你。在后續(xù)遇到更復(fù)雜的問題比如圖像拼接、物體跟蹤、UI動畫引擎開發(fā)時你會發(fā)現(xiàn)這份對基礎(chǔ)變換的深刻理解是解決所有問題的起點。