# Transformation Matrix

(1)

## Transformation Matrix

Wanho Choi (wanochoi.com)

(2)

(3)

(4)

### 2D Scale

• About origin x− axis y− axis origin q(x ,y )p(x, y) x :x= 1:a y :y= 1:b

(5)

### 2D Rotation

p(x, y) q(x ,y )x− axis y− axis origin

(6)

### 2D Rotation

p(x, y) q(x ,y )x− axis y− axis origin θ

(7)

• About origin θ x y θ

### 2D Rotation

p(x, y) q(x ,y )x− axis y− axis origin θ π 2−θ

(8)

• About origin θ θ x sinθ x cosθ x y

### 2D Rotation

p(x, y) q(x ,y )x− axis y− axis origin θ π 2−θ

(9)

• About origin θ θ x sinθ x cosθ y cosθ ysinθ x y

### 2D Rotation

p(x, y) q(x ,y )x− axis y− axis origin θ π 2−θ

(10)

• About origin θ θ x sinθ x cosθ y cosθ ysinθ x y

### 2D Rotation

p(x, y) q(x ,y )x− axis y− axis origin θ π 2−θ

(11)

### = y + dy

x− axis y− axis origin q(x ,y )p(x, y) dx dy

(12)

### All Together

• 2D scale • 2D rotation • 2D translation ′ x = axy = byx = x cosθ − ysinθ ′ y = xsinθ + ycosθ ′ x = x + dxy = y + dy

(13)

### As Matrices

• 2D scale • 2D rotation • 2D translation ′ x = axy = byx = x cosθ − ysinθ ′ y = xsinθ + ycosθ ′ x = x + dxy = y + dyxy ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ = a 00 b ⎡ ⎣ ⎢ ⎤ ⎦ ⎥⎡ xy ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ′ xy ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ = cos θ −sinθ sinθ cosθ ⎡ ⎣ ⎢ ⎤ ⎦ ⎥⎡ xy ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ′ xy ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ = x y ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥+ dx dy ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥

(14)

### As Matrices

• 2D scale • 2D rotation • 2D translation ′ x = axy = byx = x cosθ − ysinθ ′ y = xsinθ + ycosθ ′ x = x + dxy = y + dyxy ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ = a 00 b ⎡ ⎣ ⎢ ⎤ ⎦ ⎥⎡ xy ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ′ xy ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ = cos θ −sinθ sinθ cosθ ⎡ ⎣ ⎢ ⎤ ⎦ ⎥⎡ xy ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ′ xy ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ = x y ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥+ dx dy ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ matrix × vector matrix × vector vector + vector

(15)

### Simple Trick

• 2D scale • 2D rotation • 2D translation ′ x = axy = byx = x cosθ − ysinθ ′ y = xsinθ + ycosθ ′ x = x + dxy = y + dyxy 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ = a 0 0 0 b 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ x y 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ′ xy 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ = cosθ −sinθ 0 sinθ cosθ 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ x y 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ′ xy 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ = 1 0 dx 0 1 dy 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ x y 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ matrix × vector matrix × vector matrix × vector

(16)

### Transformation Matrices

• 2D scale • 2D rotation • 2D translation ′ x = axy = byx = x cosθ − ysinθ ′ y = xsinθ + ycosθ ′ x = x + dxy = y + dyxy 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ = a 0 0 0 b 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ x y 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ′ xy 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ = cosθ −sinθ 0 sinθ cosθ 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ x y 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ′ xy 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ = 1 0 dx 0 1 dy 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ x y 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ q = Sp q = Rp q = Tp

(17)

### Homogeneous Coordinate

• Introduced by August Ferdinand Möbius (1790~1868)

(a German mathematician and theoretical astronomer)

• A 2D point is represented by a 3D point.

• It has somewhat complex background, but you can

think that it is just a trick.

xy 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ = e00 e01 e01 e10 e11 e12 e20 e21 e22 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ x y 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ x, y,1 ( ) → ′(x ,y ,1′ ) instead of x, y( ) → ′(x ,y′)

(18)

### 2D Point vs 2D Vector

• 2D point:

• When transforming a vector using transformation

matrices, we must not consider the translation.

• Therefore, 2D vector:

### (x, y,0)

(0,0) (1,0) (0,1) dx = 1, dy = 1 (1,1) (2,1) (1,2) (0,1) right wrong

(19)

• Vector + Vector = Vector (vector addition)

• Vector - Vector = Vector (vector subtraction)

Point + Point: undefined

Point - Point = Vector (displacement) • Point + Vector = Point (translation)

(20)

• Vector + Vector = Vector (vector addition)

• Vector - Vector = Vector (vector subtraction)

Point + Point = Point (practically)Point - Point = Vector (displacement) • Point + Vector = Point (translation)

(21)

### 위치 벡터)

• The addition of two points is not defined mathematically.

• But, we need this operation practically. (for example, the center of points)

• For solving this problem, we introduce the concept of “position vector”.

• A point is regarded as a vector (from the origin to the point position) temporarily for the computation.

c = p1 + p2 + p3 +!+ pn

(22)

### Operating Order

• The result depends on the order of operations.

rotate translate

translate rotate

q = TRp

(23)

### The Order of Operations

• The result depends on the order of operations.

But usually, scale → rotation → translation

TRSp ≠ TSRp ≠ SRTp ≠ RSTp ≠ ! Sp → R Sp

→ T R Sp

### )

= TRSpx = ax cosθ − bysinθ + dxy = axsinθ + bycosθ + dy

(24)

(25)

### 3D Transformation

yz ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ = cosβ −sinβ sinβ cosβ ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ y z ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ′ zx ⎡ ⎣ ⎢ ⎤ ⎦

⎥ = ⎡ cossinγγ −sincosγγ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ z x ⎡ ⎣ ⎢ ⎤ ⎦ ⎥ ′ xy ⎡ ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ = cos α −sinα sinα cosα ⎡ ⎣ ⎢ ⎤ ⎦ ⎥⎡ xy ⎣ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ′ xyz 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ = a 0 0 0 0 b 0 0 0 0 c 0 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ x y z 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ ′ xyz 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ = 1 0 0 dx 0 1 0 dy 0 0 1 dz 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ x y z 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥

(26)

### 3D Transformation

Rz(α) = cosα −sinα 0 0 sinα cosα 0 0 0 0 1 0 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ Rx(β) = 1 0 0 0 0 cosβ −sinβ 0 0 sinβ cosβ 0 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ ⎥ Ry(γ ) = cosγ 0 sinγ 0 0 1 0 0 −sinγ 0 cosγ 0 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ ⎥ S = a 0 0 0 0 b 0 0 0 0 c 0 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ T = 1 0 0 dx 0 1 0 dy 0 0 1 dz 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥

(27)

### Six Rotation Orders

• • • • • • RxRyRz RxRzRy RyRxRz RyRzRx RzRxRy RzRyRx Rz(γ )⋅ Ry(β)⋅ Rx(α)= cosγ 0 sinγ 0 0 1 0 0 −sinγ 0 cosγ 0 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ ⎥ 1 0 0 0 0 cosβ −sinβ 0 0 sinβ cosβ 0 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥ ⎥ cosα −sinα 0 0 sinα cosα 0 0 0 0 1 0 0 0 0 1 ⎡ ⎣ ⎢ ⎢ ⎢ ⎢ ⎤ ⎦ ⎥ ⎥ ⎥ ⎥

(28)

### Affine Transformation

• Translation, rotation, scaling, shear, and reflection

• It preserves parallelism, and ratios of distances between points lying on a straight line.

But, it does not necessarily preserve angles between

(29)

00

01

02

03

10

11

12

13

20

21

22

23

30

31

32

### m

33 0 1 translation

rotation and/or shear

(30)
(31)

### Classes of Transformations

Rigid Transformation: distance preservingTranslation + Rotation

Similarity Transformation: angle preservingRigid + Isotropic Scale

Affine Transformation: line parallelism/ratio preservingSimilarity + Scale + Shear + Reflection

(32)

### Transformation with a Pivot

(33)

1 0 pivot.x 0 1 pivot.y 0 0 1 ⎛ ⎝ ⎜ ⎜ ⎜ ⎞ ⎠ ⎟ ⎟ ⎟ ⋅ cosθ −sinθ 0 sinθ cosθ 0 0 0 1 ⎛ ⎝ ⎜ ⎜⎜ ⎞ ⎠ ⎟ ⎟⎟⋅ 1 0 − pivot.x 0 1 − pivot.y 0 0 1 ⎛ ⎝ ⎜ ⎜ ⎜ ⎞ ⎠ ⎟ ⎟ ⎟ = 1 0 pivot.x 0 1 pivot.y 0 0 1 ⎛ ⎝ ⎜ ⎜ ⎜ ⎞ ⎠ ⎟ ⎟ ⎟⋅

cosθ −sinθ − pivot.x ⋅cosθ + pivot.y⋅sinθ sinθ cosθ − pivot.x ⋅sinθ − pivot.y⋅cosθ

0 0 1 ⎛ ⎝ ⎜ ⎜ ⎜ ⎞ ⎠ ⎟ ⎟ ⎟ =

cosθ −sinθ − pivot.x ⋅cosθ + pivot.y⋅sinθ + pivot.x sinθ cosθ − pivot.x ⋅sinθ − pivot.y⋅cosθ + pivot.y

0 0 1 ⎛ ⎝ ⎜ ⎜ ⎜ ⎞ ⎠ ⎟ ⎟ ⎟ ≡ cosθ −sinθ tx sinθ cosθ ty 0 0 1 ⎛ ⎝ ⎜ ⎜⎜ ⎞ ⎠ ⎟ ⎟⎟ tx ty ⎛ ⎝

⎜ ⎞⎟ = ⎛ − pivot.x ⋅cos− pivot.x ⋅sinθθ− pivot.y⋅cos+ pivot.y⋅sinθθ + pivot.x+ pivot.y ⎝ ⎜ ⎞ ⎠ ⎟ = cosθ −sinθ sinθ cosθ ⎛ ⎝⎜ ⎞ ⎠⎟ − pivot.x − pivot.y ⎛ ⎝ ⎜ ⎞ ⎠ ⎟ +⎛ pivot.xpivot.y ⎝ ⎜ ⎞ ⎠ ⎟

(34)

### Column-Major vs Row-Major Vector

• Column-major vector • Row-major vector

c

r

3 × 1 1 × 3

c

rT

c

c

r

r

T

T

T

(35)

### Column-Major vs Row-Major Vector

• Column-major vector • Row-major vector [x′ y′ z′] = [x y z] a d g b e h c f i = [ax + by + cz dx + ey + fz gx + hy + iz] x′ y′ z′ = a b c d e f g h i [ x y z] = ax + by + cz dx + ey + fz gx + hy + iz x′= ax + by + cz y′ = dx + ey + fz z′= gx + hy + iz

(36)

### Column-Major vs Row-Major Matrix

• Column-major matrix • Row-major matrix

Maya, DirectX, PBRT, Zelos OpenGL, Eigen (default)

m0 m1 m2 m3 m4 m5 m6 m7 m8 m9 m10 m11 m12 m13 m14 m15 m0 m4 m8 m12 m1 m5 m9 m13 m2 m6 m10 m14 m3 m7 m11 m15

(37)

Updating...

Updating...

관련 주제 :