Transformations

Objectives

Understand how transformations work in 2D and 3D

Understand the concept of homogenous coordinate system

Understand scene graphs and hierarchical composition of transformations

Get familiar with transformations in OpenGL and DirectX

Transformations

Transformations change 2D or 3D points and vectors, or change coordinate systems. An object transformation alters the coordinates of each

point on the object according to the same rule, leaving the underlying coordinate system fixed.

A coordinate transformation defines a new coordinate system in terms of the old one, then represents all of the object’s points in this new system.

Object transformations are easier to understand, so we will do them first.

Transformations (2)

A (2D or 3D) transformation T( ) alters each point P into a new point Q using a specific formula or algorithm: Q= T(P).

Transformations (3)

An arbitrary point P in the plane is mapped to Q.

Q is the image of P under the mapping T. We transform an object by transforming each

of its points, using the same function T() for each point.

The image of line L under T, for instance, consists of the images of all the individual points of L.

Transformations (4)

Most mappings of interest are continuous, so the image of a straight line is still a connected curve of some shape, although it’s not necessarily a straight line.

Affine transformations, however, do preserve lines: the image under T of a straight line is also a straight line.

Geometric Effects of Affine Transformations

Combinations of four elementary transformations: (a) a translation, (b) a scaling, (c) a rotation, and (d) a shear (all shown below).

TPP

d

dT

y

xP

y

xP

dyydxx

yxP

yxPP

yx

Now

,,

torscolumn vec theDefine

axis.y toparallel d axis, x toparallel d distance a ),(Point totranslate

),,( as defined Point

y

x

yx

2D Translations

PP’

y

x.

0

0

y

xor

Now

0

0

matrix theDefine

. ,.

axis.y thealong s and

axis, x thealong sfactor aby ),(Point to(stretch) scale a Perform

),,( as defined Point

y

x

y

x

y

x

yx

s

sPSP

s

sS

ysyxsx

yxP

yxPP

2D Scaling from the origin

PP’

2D Rotation about the origin

y

x

r

r

P’(x’,y’)

P(x,y)

Recall the right-hand rule!

2D Rotation about the origin

y

x

r

r

P’(x’,y’)

P(x,y)

y

sin.

cos.

ry

rx

x

cos.sin.sin.cos.)sin(.

sin.sin.cos.cos.)cos(.

rrry

rrrx

2D Rotation about the origin.

sin.

cos.

ry

rx

cos.sin.sin.cos.)sin(.

sin.sin.cos.cos.)cos(.

rrry

rrrx

Substituting for r :

Given us:

cos.sin.

sin.cos.

yxy

yxx

After all, these are just High-schools formulas!

2D Rotation about the origin.

cos.sin.

sin.cos.

yxy

yxx

Rewriting in matrix form gives us :

y

x

y

x.

cossin

sincos

PRPR

,

cossin

sincosmatrix theDefine

Shear: Off Diagonal Elements

ybx

x

y

x

b 1

01

y

ayx

y

xa

10

1

Example 1

y

yx

x

y

xyxT

4.0

14.0

01),(

)1,0(

)0,1(

)1,1(

)0,0(

S

x

Example 1

x

y

yx

x

yxT

4.0

),(

S

)1,0(

)0,1(

)1,1(

)0,0(

Example 1

y

)1,0(

)4.0,1(

)0,0(

T(S)

yx

x

yxT

4.0

),()4.1,1(

x

Example 2

y

y

yx

y

xyxT

6.0

10

6.01),(

S

x

)1,0(

)0,1(

)1,1(

)0,0(

Example 2

x

y

y

yx

yxT

6.0

),(

S

)1,0(

)0,1(

)1,1(

)0,0(

Example 2

x

y

)1,0(

)0,1()0,0(

T(S)

)1,6.0(

y

yxyxT

6.0 ),(

)1,6.1(

Summary

Shear in x:

Shear in y:

y

ayx

y

xaShx 10

1

ybx

x

y

x

bShy 1

01

Sample Points: unit inverses

0

11

1

01

bb

1

0

10

1

1

aa

Geometric View of Shear in x

)0,1(

)1,( a )1,0(

)0,1(

)1,1(

Another Geometric View of Shear in x

x24x x

yy

Another Geometric View of Shear in x

25

x

y

Geometric View of Shear in y

)1,0(

)0,0(

),1( b

)1,0(

)0,1()0,0(

)1,1(

Another Geometric View of Shear in y

h h27

x

y

x

y

Another Geometric View of Shear in y

28

x

y

Transformations

Translation. P=T + P

Scale P=S P

Rotation P=R P

Shear P=H P

We would like all transformations to be multiplications so we can concatenate them express points in homogenous coordinates.

Homogeneous coordinates Add an extra coordinate, W, to a point.

P(x,y,W). Two sets of homogeneous coordinates represent the same point if

they are a multiple of each other.

(2,5,3) and (4,10,6) represent the same point. At least one component must be non-zero (0,0,0) is not allowed. If W 0 , divide by it to get Cartesian coordinates of point

(x/W,y/W,1). If W=0, point is said to be at infinity.

P(x,y,0) can be interpreted as the vector v(x, y) Both points and vectors are represented by the same set of

underlying objects

Homogeneous coordinates If we represent (x,y,W) in 3-space, all triples representing the

same point describe a line passing through the origin. If we homogenize the point, we get a point of form (x,y,1)

homogenised points form a plane at W=1.

P

X

Y

W

W=1 plane

Translations in homogenised coordinates

Transformation matrices for 2D translation are now 3x3.

1

.

100

10

01

1

y

x

d

d

y

x

y

x

11

y

x

dyy

dxx

Concatenation

We perform 2 translations on the same point:

),(),(),(

:expect weSo

),(),(),(

),(

),(

21212211

21212211

22

11

yyxxyxyx

yyxxyxyx

yx

yx

ddddTddTddT

ddddTPddTddTPP

ddTPP

ddTPP

Concatenation.

Matrix product is variously referred to as compounding, concatenation, or composition.This single matrix is called the Coordinate Transformation Matrix or CTM.

100

10

01

100

10

01

.

100

10

01

: is ),(),(product matrix The

21

21

2

2

1

1

2211

yy

xx

y

x

y

x

yxyx

dd

dd

d

d

d

d

ddTddT

Homogeneous form of scale

y

xyx s

sssS

0

0),(

Recall the (x,y) form of Scale :

100

00

00

),( y

x

yx s

s

ssS

In homogeneous coordinates :

Concatenation of scales.

!multiply easy to -matrix in the elements diagonalOnly

100

0ss0

00ss

100

0s0

00s

.

100

0s0

00s

: is ),(),(product matrix The

y2y1

x2x1

y2

x2

y1

x1

2211

yxyx ssSssS

Homogeneous form of rotation

1

.

100

0cossin

0sincos

1

y

x

y

x

)()(

: i.e ,orthogonal are matricesRotation

).()(

matrices,rotation For

1

1

TRR

RR

Composition of Transformations

Suppose we want to rotate around an arbitrary point P Idea: Compose simple transformations

1. Translate P to origin2. Rotate around origin3. Translate origin back to P

The order is very important!

Order!

3D Transformations

Use homogeneous coordinates, just as in 2D case. Transformations are now 4x4 matrices. We will use a right-handed (world) coordinate system - ( z out of

page ).

z (out of page)

y

x

Note:Convenient to think of display asBeing left-handed !!( z into the screen )

More on Homogeneous Coordinates

To: if the object is a vector, add a 0 as the 4th coordinate; if it is a point, add a 1.

From: If the 4th coordinate is zero, then simply remove it. If it is not, then divide the other coordinate by it and remove it.

OpenGL uses 4D homogeneous coordinates for all its vertices. If you send it a 3-tuple in the form (x, y, z), it converts it

immediately to (x, y, z, 1). If you send it a 2D point (x, y), it first appends a 0 for the z-

component and then a 1, to form (x, y, 0, 1). All computations are done within OpenGL in 4D homogeneous

coordinates.

Combinations

Linear combinations of vectors and points: The difference of 2 points is a vector: the fourth

component is 1 – 1 = 0 The sum of a point and a vector is a point: the

fourth component is 1 + 0 = 1 The sum of 2 vectors is a vector: 0 + 0 = 0 A vector multiplied by a scalar is still a vector Linear combinations of vectors are vectors

Translation in 3D

1000

100

010

001

),,(z

y

x

zyx d

d

d

dddT

Simple extension to the 3D case:

•In OpenGL: glMatrixMode(GL_ModelView);glTranslatef(dx, dy, dz);

•In DirectX: device.Transform.World = Matrix.Translation(dx, dy, dz)

Scale in 3D

1000

000

000

000

),,(z

y

x

zyx s

s

s

sssS

Simple extension to the 3D case:

In OpenGL:

glMatrixMode(GL_ModelView);glScalef(Sx, Sy, Sz);

In DirectX: device.Transform.World = Matrix.Scaling(Sx, Sy, Sz)

Rotation in 3D

Need to specify which axis the rotation is about. z-axis rotation is the same as the 2D case.

1000

0100

00cossin

00sincos

)(

zR

•In OpenGL: glMatrixMode(GL_ModelView);glRotatef(theta, 0.0f, 0.0f, 1.0f);

•In DirectX: device.Transform.World = Matrix.RotationZ(theta)

Rotation in 3D For rotation about the x and y axes:

1000

0cos0sin

0010

0sin0cos

)( ,

1000

0cossin0

0sincos0

0001

)(

yx RR

•In OpenGL: glMatrixMode(GL_ModelView);glRotatef(theta, 1.0f, 0.0f, 0.0f); //gRotatef(theta,0.0f,1.0f,0.0f) (about y)

•In DirectX: device.Transform.World = Matrix.RotationZ(theta); //Matrix.RotationY(theta) (about y)

Transformations of coordinate systems• Alternate view: when we apply a transformation, we’re not changing the coordinates of a point within a coordinate system. Instead, we’re changing the coordinate system itself

• All the transformations are performed relative to the current coordinate frame origin and axes; OpenGL post-multiplies each new transformation matrix

Successive Transformations

1

)()()()(

ji

)(

:shown that be alsocan It

:onsubstitutiby obtain we

and

i systemin point a toj systemin point a converts that transform theas M Define

system coordinatein point a as Define

jiij

kjjiki

kkj

jjji

i

i

MM

MMM

PMPPMP

iP

C1 C2 C3 M1 M2

Given P (a3,b3) in C3What is P’s coordinates in C1?

1) Get P’s coordinates in C2 P_c2 = M2 x P

2) Get P_c2’s coordinates in C1 P_c1 = M1 x P_c2

P_c1 = M1 x M2 x P the answer!!

C1

M1

C2M2

(a3,b3)

C3

a3b3

Successive Transformations (2) The sequence

translate 1.5 0 0 cube translate 8.5 0 0 cubewill draw two cubes with x centres 1.5 and 10.0 respectively.

We could create the same image with the sequence save state

translate 1.5 0 0cube

restore state save state

translate 10.0 0 0cube

restore state Here both cubes have an absolute translation and the order in

which the two cubes are drawn does not matter.

Hierarchical composition using Push and Pop

glPushMatrix(); Save the state. Push a copy of the CTM onto the stack. The CTM itself is unchanged.

glPopMatrix(); Restore the state, as it was at the last Push. Overwrite the CTM with the matrix at the top of the

stack. glLoadIdentity();

Overwrite the CTM with the identity matrix.

Scene graphs

3D scenes are often stored in a directed acyclic graph (DAG) called a scene graph Open Scene Graph (used in the Cave) Sun’s Java3D™ VRML

Common scene graph format: objects (cubes, spheres, cones, ...)

stored as leaf nodes attributes (color, texture map, etc.), and transformations are also nodes in a scene graph

Very helpful in designing complex objects Allows us to know when to push and when to pop Allows to know when to use display lists/index buffers Allows us to animate different parts of a complex object

Scene graphs

ROBOT

upper body lower body

head trunk arm

stanchion base

2. We transform them

3. To make sub-groups

4. Transform subgroups

5. To get final scene

1. Leaves of tree are standard size object primitives

Hierarchical transformation and scene graphs

Example:

- for o1, CT = m1- for o2, CT = m2* m3- for o3, CT = m2* m4* m5

- for a vertex v in o3, position in the world (root) coordinate system is:CT.v = (m2*m4*m5)v

m1 m2

m3 m4

o1

o2

o3

g1

g2

g: group nodesm: matrices of transform nodeso: object nodes

Transformations in OpenGL: Summary

Important:• OpenGL maintains a number of matrices: ModelView, Projection, and Texture.• We switch between them with the glMatrixMode() routine• The most recent call to glMatrixMode() selects OpenGL’s current transformation (CT) matrix• Transformations are applied by post-multiplying CT by the desired transformation:

CT = CT · M

Practice session

Use glRotate and Matrix.RotationAxis to rotate around any line

Use scence graphs and hierarchical composition of transformations to build a nice 3D car and nice 3D airplane