361-07: 3D Transformations - Computing Science - … unit vectors, i.e, orthonormal • Property 2: determinant of M = 1 • product of any pair of orthonormal matrices is also orthonormal

© Machiraju/Zhang/Möller

3D Transformations

CMPT 361Introduction to Computer Graphics

Torsten Möller

© Machiraju/Zhang/Möller2

Schedule• Geometry basics• Affine transformations• Use of homogeneous coordinates• Concatenation of transformations• 3D transformations• Transformation of coordinate systems• Transform the transforms• Transformations in OpenGL


Transformations in 3D• Add a z-axis to (x, y) plane

– right-handed system:• positive z pointing towards us• positive rotation counter-clockwise• Standard math convention (used in our presentation

and OpenGL)– left-handed system:

• positive z pointing away from us• positive rotation clockwise• Used in some graphics systems

(z-axis as depth), e.g., POV-Ray, and Renderman


Translation in 3D• Again, we use homogeneous coordinates

T (tx, ty, tz) =

�

⇧⇧⇤

1 0 0 tx0 1 0 ty0 0 1 tz0 0 0 1

⇥

⌃⌃⌅


Scaling in 3D

S(sx, sy, sz) =

�

⇧⇧⇤

sx 0 0 00 sy 0 00 0 sz 00 0 0 1

⇥

⌃⌃⌅


Rotation in 3D• Around z-axis

• Around x-axis

• Around y-axis

Rz(�) =

�

⇧⇧⇤

cos � � sin� 0 0sin� cos � 0 0

0 0 1 00 0 0 1

⇥

⌃⌃⌅

Rx(�) =

�

⇧⇧⇤

1 0 0 00 cos � � sin� 00 sin� cos � 00 0 0 1

⇥

⌃⌃⌅

Ry(�) =

�

⇧⇧⇤

cos � 0 sin� 00 1 0 0

� sin� 0 cos � 00 0 0 1

⇥

⌃⌃⌅


• Property 1: columns and rows are mutually orthogonal unit vectors, i.e, orthonormal

• Property 2: determinant of M = 1

• product of any pair of orthonormal matrices is also orthonormal

• orthonormality: inverse = transpose (PT= P−1)

Properties of rotation matrix

M =

�

⇧⇧⇤

r11 r12 r13 0r21 r22 r23 0r31 r32 r33 00 0 0 1

⇥

⌃⌃⌅


Another nice property• row vectors: unit vectors which rotate into

principal axes, i.e., [1 0 0]T, [0 1 0]T, and [0 0 1]T

• column vectors: unit vectors into which principle axes rotate (obviously)

�

⇤100

⇥

⌅ =

�

⇤r11 r12 r13

r21 r22 r23

r31 r32 r33

⇥

⌅

�

⇤r11

r12

r13

⇥

⌅

�

⇤010

⇥

⌅ =

�

⇤r11 r12 r13

r21 r22 r23

r31 r32 r33

⇥

⌅

�

⇤r21

r22

r23

⇥

⌅

�

⇤001

⇥

⌅ =

�

⇤r11 r12 r13

r21 r22 r23

r31 r32 r33

⇥

⌅

�

⇤r31

r32

r33

⇥

⌅


Shearing in 3D• In (y, z) w.r.t. x value

• In (z, x) w.r.t. y value

• In (x, y) w.r.t. z value

SHyz =

�

⇧⇧⇤

1 0 0 0shy 1 0 0shz 0 1 00 0 0 1

⇥

⌃⌃⌅

SHxz =

�

⇧⇧⇤

1 shx 0 00 1 0 00 shz 1 00 0 0 1

⇥

⌃⌃⌅

SHxy =

�

⇧⇧⇤

1 0 shx 00 1 shy 00 0 1 00 0 0 1

⇥

⌃⌃⌅


Inverse Transforms• Translation: negate tx, ty, tz

• Scaling: change sx to 1/sx , etc.• Rotation: negate the angle• Shearing: negate shy, shz, etc.


General 3D transformations• Any arbitrary sequence of rotation, translation

scaling, and shear can be represented as:

• where upper left 3 × 3 is the combined scaling, rotation, and shearing; [tx ty tz]T for translation

M =

�

⇧⇧⇤

r11 r12 r13 txr21 r22 r23 tyr31 r32 r33 tz0 0 0 1

⇥

⌃⌃⌅


Compound transforms• Just like in 2D, however …• Rotation is about more than one axis

• How should we do this?

P3 on (y, z) plane


Compute compound transform• Use of right-hand CS

• Translation by P1 so that P1 is at origin

• Rotation about y by (θ − 90°)to get P1P2 onto the (y, z) plane

P3

P1P2

y

zx

T(–x1, –y1, –z1)

yP3

P1 P2

zx

θ

P3

P3


Compute compound transform• Rotation about x by φ to

get P1P2 to align with the positive z-axis

• Rotation about z by α to get P1P3 onto the (y, z) plane

Ry(θ − 90°)

P3

P1

P2

y

zx

φ

Rx(φ)

P3

P1P2

y

zx

α


Compute compound transform• Combined transformation:

P3

P1P2

y

zx

Rz(α)

P3

P1P2

y

zx

Rz(�)⇥Rx(⇤)⇥Ry(⇥ � 90�)⇥ T (�P1)


Alternative composition• Recall the “nice” properties of the rotation

matrices:

• Ri’s are the unit row vectors which rotate into principal coordinate axes, e.g., RRxT = [1 0 0]T

• Let us try to construct these directly, assuming the translation T(−P1) is already done.


Alternative composition• the unit vector to move to lie on the positive z

axis is:

• the unit vector that rotates into x is normal to the plane P1P2P3.


Alternative composition• By definition, Rz × Rx must rotate into the

remaining y-axis and:

• We are done:

M =�

R 00 1

⇥⇥ T (�P1),where R =

⇤

⇧Rx

Ry

Rz

⌅

⌃


Exercise• How to get the jet into the desired direction of

flight (DOF)?


Special transformations• Points: we have been doing this so far• Lines: just transform the endpoint of a line• Planes: trickier

– if defined by 3 points, can transform points, – but ... more often defined by a plane equation


• By homogeneous coordinates we can write:

• with P = [x y z 1]T:

• Now, suppose we want to transform our space by matrix M

• To maintain NTP = 0 , we must also transform N. Let this transform be Q.

21

Plane transform

N =�

A B C D⇥T

NT P = 0


Plane transform: derivation• After the transform we have:

• and we would like to have:

• now some algebra:

Pn = MPNn = QN

NTn Pn = 0

NTn Pn = (QN)T (MP )

= NT (QT M)P= 0


Plane transform: result• This will hold when:

• hence:

QT M = kI

Q = M�T




Transformation of CS• So far: transform points on one

object with respect to the same coordinate system (CS)

• Sometimes need to change CS• e.g. we may have many objects,

each in its own CS, and we want to express all of them in some GLOBAL CS

?


CS2

CS1

2

2

2

4

6

4 6

2

4

6

4 6

CS1: P=P(6,5) CS2: P=P(2,3)

26

Transformation of CS• P(i) = point in coordinate system i• M2←1 converts representation of point in CS1 to

representation of point in CS2

• Alternate interpretation:M2←1 transforms axesof CS2 into axes of CS1


• By definition:• Hence:• Therefore:

• with other words, M2←1 transforms CS2 into CS1

27

DerivationP (2) = M2�1P

(1)

CS2P(2) = CS1P

(1)

CS2M2�1 = CS1


Transform of CS: example• Example: M2←1 = T(−4, −2), this is seen by

inspection• (2,3)T = T(−4, −2)(6,5)T

• CS1 = CS2 T(−4, −2)

CS2

CS1

2

2

2

4

6

4 6

2

4

6

4 6

CS1: P=P(6,5) CS2: P=P(2,3)


• Observe transitivity of this operator:– Given

– then

– so that

• this is/was our basic concatenation of transformations

29

Transform of CS: transitivity

P (j) = Mj�iP(i)

P (k) = Mk�jP(j)

P (k) = Mk�jMj�iP(i)

Mk�i = Mk�jMj�i


Transformation of CS• Example: what is M2←3?

– M2←3 = M2←3’ M3’←3 with CS3’ aligned with CS3 but having the same scale as CS2

– M3’←3 transforms CS3’ to CS3: S(0.5, 0.5)

– M2←3’ transforms CS2 to CS3’:T(2, 3)

– M2←3 = T(2, 3)S(0.5, 0.5)– Verify: – Alternative: M2←3 = S(0.5, 0.5) T(4, 6)

CS3’


• What is M3 ← 4?– M3←4 = M3←4’ M4’←4

with CS4’ as shown – M4’←4 transforms CS4’

to CS4: R(+45)– M3←4’ transforms CS3

to CS4’ : T(6.7, 1.8)– M3←4 = T(6.7, 1.8)R(+45)– Verify:

31

Transform of CS: example

4’




Transforming the transforms• Suppose Qj is a transformation in CSj

• Need Qi that acts on points, with respect to CSi, just like Qj would on the same points

• Assume that we know Mi ← j

CSi

CSjQj

Qi?Pi = Mi�jPj

P ⇥i = Mi�jP

⇥j

P ⇥j = QjPj

P ⇤i = Mi⇥jP

⇤j

= Mi⇥jQjPj

= [Mi⇥jQjM�1i⇥j ]Pi

Qi = Mi⇥jQjM�1i⇥j


Example: How does a point P on the front tricycle wheel move in the world CS (wo) when the wheel rotates forward by an angle of α about its own zwh?

34

Transforming the transforms

© Machiraju/Zhang/Möller 35

Transforming the transformsP ⇥(wo) = Mwo�whP ⇥(wh)

= Mwo�whMwh�wh�P ⇥(wh�)

= Mwo�whT (�r, 0, 0)P ⇥(wh�)

= Mwo�whT (�r, 0, 0)Rz(��)P (wh)

wh’

αrP: original point

P’: transformed point



© Angel/Shreiner/Möller

Coordinate Systems• The units in points are determined by the application and

are called– object (or model) coordinates– world coordinates

• Viewing specifications usually are also in object coordinates• transformed through

– eye (or camera) coordinates– clip coordinates– normalized device coordinates– window (or screen) coordinates

• OpenGL also uses some internal representations that usually are not visible to the application but are important in the shaders 37

model view transform

projection transform


CTM in OpenGL • OpenGL had a model-view and a projection

matrix in the pipeline which were concatenated together to form the CTM

• Angel emulates this process

38


Rotation, Translation, Scaling

mat4 r = Rotate(theta, vx, vy, vz)m = m*r;

mat4 s = Scale( sx, sy, sz)mat4 t = Transalate(dx, dy, dz);m = m*s*t;

mat4 m = Identity();

Create an identity matrix:

Multiply on right by rotation matrix of theta in degrees where (vx, vy, vz) define axis of rotation

Do same with translation and scaling:


Rotation, Translation, Scaling• Create an identity matrix:

• Multiply on right by rotation matrix of theta in degrees where (vx, vy, vz) define axis of rotation

• Do same with translation and scaling:

40

mat4 r = Rotate(theta, vx, vy, vz)m = m*r;

mat4 s = Scale( sx, sy, sz)mat4 t = Transalate(dx, dy, dz);m = m*s*t;

mat4 m = Identity();


Example• Rotation about z axis by 30 degrees with a

fixed point of (1.0, 2.0, 3.0)

• Remember that last matrix specified in the program is the first applied

41

mat4 m = Identity();m = Translate(1.0, 2.0, 3.0)* Rotate(30.0, 0.0, 0.0, 1.0)* Translate(-1.0, -2.0, -3.0);


Arbitrary Matrices• Can load and multiply by matrices defined in

the application program• Matrices are stored as one dimensional array of

16 elements which are the components of the desired 4 x 4 matrix stored by columns

• OpenGL functions that have matrices as parameters allow the application to send the matrix or its transpose

42

Documents

361-07: 3D Transformations - Computing Science - … unit vectors, i.e, orthonormal • Property 2: determinant of M = 1 • product of any pair of orthonormal matrices is also orthonormal