Graphics

kucg.korea.ac.kr Graphics Lab @ Korea University

Transformations

고려대학교 컴퓨터 그래픽스 연구실

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Contents

Affine transformations rotation, translation, and scaling

Transformations in homogeneous coordinates Concatenation of transformations

rotation about a fixed point general rotation instance transformation rotation about an arbitrary axis

OpenGL transformation matrices Smooth rotation with a virtual trackball

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Transformations

Take a point (or vector) and map that point (or vector) into another point (or vector)

P

Q

u v

T

R PTQ

uRv

pq f

uv f

homogeneoushomogeneouscoordinatecoordinate

4D column matrices

transformation function

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Affine Transformations (1/2)

Linearity – linear function

Linear transformation transform the representation of a point (or vector) into

another representation of a point (or vector)

qfpfqpf

Auv

100034333231

24232221

14131211

aaaa

aaaa

aaaa

A

03

2

1

u

13

2

1

p

44 matrix vector point

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Affine Transformations (2/2)

Linear transformation (cont’) preserve lines – transform a line into another line

only transform the endpoints of a line segment

Most transformations in CG are affine rotation, translation, scaling, and shear

dPP 0

dpp 0

AdApAp 0

homogeneouscoordinate

affine transformation

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Translation

Operation that displace points by a fixed distance in a given direction displacement vector d

dPP

(a) object in original position

(b) object translated

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation (1/2)

Simple example of 2D rotation

sin

cos

sin

cos

y

x

y

x

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation (1/2)

Simple example of 2D rotation

sin

cos

sin

cos

y

x

y

x

cossincossinsincos

sincossinsincoscos

yxy

yxx

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation (1/2)

Simple example of 2D rotation

sin

cos

sin

cos

y

x

y

x

cossincossinsincos

sincossinsincoscos

yxy

yxx

y

x

y

x

cossin

sincos

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation (2/2)

Needs fixed point – a point is unchanged by the rotation rotation angle – positive rotation (counterclockwise in

right hand system) rotation axis in 3D – values on axis are unchanged

by the rotation

(a) rotation about a fixed point (b) 3D rotation

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rigid-Body Transformations

Rotation and translation No combination of rotations and translations can

alter the shape of object alter only the object’s location and orientation

affine transformations, but non-rigid body transformations

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Scaling (1/2)

Make an object bigger or smaller uniform – scaling in all directions

Affine non-rigid body transformation affine transformation: translation, rotation, scaling,

shear

nonuniform

uniform

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Scaling (2/2)

Needs fixed point direction to scale scale factor

longer (α>1) or smaller (0≤α<1)

Reflection – negative scale factoreffect of scale

factor

reflection

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Transformations in Homogeneous Coordinates

Representations in homogeneous coordinates

Affine transformation – 44 matrix

vPQ

013

2

1

3

2

1

vpq

100034333231

24232221

14131211

aaaa

aaaa

aaaa

M

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Translation

Point p to p’ by displacing by a distance ddpp

0

,

1

,

1z

y

x

z

y

x

z

y

x

dppz

y

x

zz

yy

xx

z

y

x

zz

yy

xx

pp T

translation matrix

?

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Translation

Point p to p’ by displacing by a distance ddpp

0

,

1

,

1z

y

x

z

y

x

z

y

x

dppz

y

x

zz

yy

xx

z

y

x

zz

yy

xx

pp T

1000

100

010

001

z

y

x

T

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Translation

Point p to p’ by displacing by a distance d

Inverse of a translation matrix

dpp

0

,

1

,

1z

y

x

z

y

x

z

y

x

dppz

y

x

zz

yy

xx

z

y

x

zz

yy

xx

pp T

1000

100

010

001

z

y

x

T

zyxzyx TT ,,,,1 ?

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Translation

Point p to p’ by displacing by a distance d

Inverse of a translation matrix

dpp

0

,

1

,

1z

y

x

z

y

x

z

y

x

dppz

y

x

zz

yy

xx

z

y

x

zz

yy

xx

pp T

1000

100

010

001

z

y

x

T

1000

100

010

001

,,,,1

z

y

x

zyxzyx TT

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Scaling

Scaling matrix with a fixed point of the origin

zz

yy

xx

z

y

x

pp S

zyxS ,, zyxS ,,

scaling matrix

?

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Scaling

Scaling matrix with a fixed point of the origin

zz

yy

xx

z

y

x

pp S

1000

000

000

000

z

y

x

S

zyxS ,, zyxS ,,

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Scaling

Scaling matrix with a fixed point of the origin

Inverse of a scaling matrix

zz

yy

xx

z

y

x

pp S

zyx

zyx SS

1,

1,

1,,1 ?

1000

000

000

000

z

y

x

S

zyxS ,, zyxS ,,

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Scaling

Scaling matrix with a fixed point of the origin

Inverse of a scaling matrix

zz

yy

xx

z

y

x

pp S

1000

0100

0010

0001

1,

1,

1,,1

z

y

x

zyx

zyx SS

1000

000

000

000

z

y

x

S

zyxS ,, zyxS ,,

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation (1/2)

Rotation with a fixed point at the origin

zz

yxy

yxx

cossin

sincos pp zR zR zR

rotation matrix

?

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation (1/2)

Rotation with a fixed point at the origin

zz

yxy

yxx

cossin

sincos pp zR

1000

0100

00cossin

00sincos

zR

xx RR ?

zR zR

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation (1/2)

Rotation with a fixed point at the origin

zz

yxy

yxx

cossin

sincos pp zR

1000

0cossin0

0sincos0

0001

xx RR yy RR ?

1000

0100

00cossin

00sincos

zR

zR zR

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation (1/2)

Rotation with a fixed point at the origin

zz

yxy

yxx

cossin

sincos pp zR

1000

0cossin0

0sincos0

0001

xx RR

1000

0cos0sin

0010

0sin0cos

yy RR

1000

0100

00cossin

00sincos

zR

zR zR

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation (2/2)

Inverse of a rotation matrix

RR 1

sinsin,coscos

zz RR 1 ?

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation (2/2)

Inverse of a rotation matrix

RR 1

sinsin,coscos

1000

0100

00cossin

00sincos

1000

0100

00cossin

00sincos

1

zz RR

TRR 1 : orthogonal matrix

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Shear (1/2)

One more affine transformation

shear the object in the x direction

z

y

x

?

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Shear (1/2)

One more affine transformation

shear the object in the x direction

zz

yy

yxx

cot

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Shear (2/2)

Shear in the x directionpp xH

xH xH

zz

yy

yxx

cot

shearing matrix

?

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Shear (2/2)

Shear in the x directionpp xH

1000

0100

0010

00cot1

xHzz

yy

yxx

cot

xH xH

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Shear (2/2)

Shear in the x direction

Inverse of a shearing matrix

pp xH

1000

0100

0010

00cot1

xHzz

yy

yxx

cot

xx HH 1 ?

xH xH

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Shear (2/2)

Shear in the x direction

Inverse of a shearing matrix

pp xH

1000

0100

0010

00cot1

xHzz

yy

yxx

cot

1000

0100

0010

00cot1

1

xx HH

xH xH

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Concatenation of Transformations

Concatenating affine transformations by multiplying together sequences of the basic transformations

define an arbitrary transformation directly ex) three successive transformations

CBApApBCq

A B Cp q

CBAM

Mpq Mp q

CBA

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation about a Fixed Point (1/3)

Fixed point: pf

apply Rz() to rotation about a fixed point

rotation of a cube about its center

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation about a Fixed Point (2/3)

sequence of transformations

fzf pTRpT M

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation about a Fixed Point (3/3)

fzf pTRpT M

1000

100

010

001

1000

0100

00cossin

00sincos

1000

100

010

001

f

f

f

f

f

f

z

y

x

z

y

x

1000

0100

cossin0cossin

sincos0sincos

fff

fff

yxy

yxx

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

General Rotation (1/2)

Three successive rotations about the three axes

rotation of a cube about the z axisrotation of a cube about the y axis

rotation of a cube about the x axis

?

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

General Rotation (2/2)

zyx RRRR

1000

0100

00cossin

00sincos

1000

0cos0sin

0010

0sin0cos

1000

0cossin0

0sincos0

0001

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Instance Transformation (1/2)

Instance of an object’s prototype occurrence of that object in

the scene

Instance transformation applying an affine

transformation to the prototype to obtain desired size, orientation, and location

instance transformation

?

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Instance Transformation (2/2)

TRSM

1000

000

000

000

1000

0100

00cossin

00sincos

1000

100

010

001

z

y

x

z

y

x

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation about an Arbitrary Axis (1/6)

Needs fixed point: p0

rotation angle: θ rotation axis: vector p2-p1

12 ppu

z

y

x

u

uv

rotation of a cube about an arbitrary

axis

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation about an Arbitrary Axis (2/6)

First transformation is translation T(-p0) and the final one is T(p0)

Rotation problem!!! we can get an arbitrary rotation

from three rotations about

individual axescarry out two rotations to align

the axis of rotation with the z

axis rotate by θ about the the z axis

movement of the fixed point to the

origin

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation about an Arbitrary Axis (3/6)

Determine x and y direction angles and cosines

1222 zyx

zzyyxx cos ,cos ,cos

1coscoscos 222 zyx

sequence of rotations

direction angles

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation about an Arbitrary Axis (4/6)

Determine x and y (cont’) projection line segment into plane y=0

look at the projection of line segment (before rotation) on the plane x=0

computation of the x rotation

22zyd

1000

0//0

0//0

0001

dd

ddR

zy

yzxx

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation about an Arbitrary Axis (5/6)

Determine x and y (cont’) projection line segment into z axis

rotation about y axis caution!!! – clockwise angle

1000

00

0010

00

d

d

Rx

x

yy

computation of the y rotation

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotation about an Arbitrary Axis (6/6)

Finally concatenate all the matrices

Ex) rotate an object by 45 degrees about the line passing through the origin and the point (1,2,3), fixed point is the origin solution – textbook p.195~196

00 ppM TRRRRRT xxyyzyyxx

00 pRpM TT

xxyyzyyxx RRRRR R

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

OpenGL Transformation Matrices (1/2)

CTM (Current Transformation Matrix) matrix that is applied to any vertex part of the pipeline

: replacement : initialization operation: : postmultiplication

CTMvertices vertices

IC

SCTC

RCCSCCTC

CRC

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

OpenGL Transformation Matrices (2/2)

Matrix modes model-view and projection matrices

Three functions: rotation, translation, scaling

glRotatef(angle, vx, vy, vz);glTranslatef(dx, dy, dz);glScalef(sx, sy, sz);

model-view projectionvertices vertices

CTM

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Example: Rotation about a Fixed Point in OpenGL

Needs fixed point: (4, 5, 6) rotation angle: 45 degrees rotation axis: the line through the origin and the point

(1,2,3)

0.6 ,0.5 ,0.4

0.3 ,0.2 ,0.1 ,0.45

0.6 ,0.5 ,0.4

CTC

CRC

CTC

IC

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Example: Rotation about a Fixed Point in OpenGL

Needs fixed point: (4, 5, 6) rotation angle: 45 degrees rotation axis: the line through the origin and the point

(1,2,3)

glMatrixMode(GL_MODELVIWE); glLoadIdentity( ); glTranslatef(4.0, 5.0, 6.0); glRotatef(45.0, 1.0, 2.0, 3.0); glTranslatef(-4.0, -5.0, -6.0);

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotating a Cube (1/2)

glutDisplayFunc(display);glutIdleFunc(spinCube);glutMouseFunc(mouse);

void display(void){ glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glLoadIdentity(); glRotatef(theta[0], 1.0, 0.0, 0.0); glRotatef(theta[1], 0.0, 1.0, 0.0); glRotatef(theta[2], 0.0, 0.0, 1.0); colorcube(); glutSwapBuffers();}

void mouse(int btn, int state, int x, int y){ if(btn==GLUT_LEFT_BUTTON && state==GLUT_DOWN) axis=0; if(btn==GLUT_MIDDLE_BUTTON && state==GLUT_DOWN) axis=1; if(btn==GLUT_RIGHT_BUTTON && state==GLUT_DOWN) axis=2;}

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotating a Cube (2/2)

void spinCube(void){ theta[axis] += 2.0; if( theta[axis] > 360.0 ) theta[axis] -= 360.0; glutPostRedisplay();}

void mykey(char key, int mousex, int mousey){ if( key == ‘q’ || key == ‘Q’ ) exit();}

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotating a Cube (2/2)

glPushMatrix( ), glPopMatrix( ) perform a transformation and then return to the same

state as before its execution ex) instance transformation

void spinCube(void){ theta[axis] += 2.0; if( theta[axis] > 360.0 ) theta[axis] -= 360.0; glutPostRedisplay();}

void mykey(char key, int mousex, int mousey){ if( key == ‘q’ || key == ‘Q’ ) exit();}

glPushMatrix();glTranslatef(.....);glRotatef(.....);glScalef(.....);/* draw object here */glPopMatrix();

glPushMatrix();glTranslatef(.....);glRotatef(.....);glScalef(.....);/* draw object here */glPopMatrix();

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Virtual Trackball (1/3)

Use the mouse position to control rotation about two axes

Support continuous rotations of objects

trackball frame

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Virtual Trackball (2/3)

Rotation with a virtual trackball projection of the trackball position to the plane

222

2222

zxry

rzyx

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Virtual Trackball (3/3)

Rotation with a virtual trackball (cont’) determination of the orientation of a plane

rotation angle

21 ppn

211cos pp

QuaternionsQuaternions n

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Complex Numbers (1/3)

Real part + imaginary part:

Addition and subtraction

Scalar multiplication

Multiplication

iyxz

zyzx Im,Re

yxz ,

y

x

z

imaginaryaxis

real axis 21212211 , , , yyxxyxyx

1111 , , kykxyxk

122121212211 , , , yxyxyyxxyxyx

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Complex Numbers (2/3)

Imaginary unit:

Complex conjugate

modulus or absolute value

Division

1 ,0i

0 ,11 ,01 ,02 i

1i

iyxz iyxz

22 yxzzz

22

22

211222

22

212122

22

2211

22

21

2

1 , , ,

yx

yxyx

yx

yyxx

yx

yxyx

zz

zz

z

z

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Complex Numbers (3/3)

Representation with polar coordinates

Euler’s formula

Complex multiplication and division

nth roots

rθ

z=(x, y)

Imaginaryaxis

real axis

sincos irz

irez sincos iei

2121

2

1

2

12121 , ii e

r

r

z

zerrzz

1 , ,2 ,1 ,0,2

sin2

cos

nkn

ki

n

krz nn

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Quaternions (1/2)

One real part + three imaginary part

Properties:

Addition and scalar multiplication

kcjbiasq 1222 kji

jikki

ikjjk

kjiij

dkcdjbdiadsdq 11111

2121212121 cckbbjaaissqq

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Quaternions (2/2)

Ordered-pair notation

scalar ‘s’ + vector “v = (a, b, c)”

Addition: Multiplication

Magnitude

Inverse

v ,sq

212121 , vv ssqq

211221212121 , vvvvvv ssssqq

vv 22sq

v ,12

1 sq

q 0 ,111 qqqq

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Quaternions and 3D Rotation

For a 3D point (α, β, γ) a unit quaternion its conjugate

For

Rq is a 3D rotation about (ux, uy, uz) by 2θ

cbasq , , , cbasq , , ,

, , ,0 , , ,0 qq

qpqpRq

zyx uuuq , ,sin ,cos

Rotating Rotating ((αα, , ββ, , γγ)) by angleby angle 22θθ about the axis about the axis parallel toparallel to (u(uxx, u, uyy, u, uzz))

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotations with Quaternions (1/2)

Rotation about any axis set up a unit quaternion (u: unit vector)

represent any point position P in quaternion notation (p = (x, y, z))

carry out with the quaternion operation (q-1=(s, –v))

produce the new quaternion

cbas , ,2

sin ,2

cos

uv

pP ,0

1 qqPP

pP ,0

pvvpvvpvpp ss 22

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Rotations with Quaternions (2/2)

Obtain the rotation matrix by quaternion multiplication

Include the translations

xxyyzyyxx

R

basabcsbac

sabccascab

sbacscabcb

RRRRR

M

22

22

22

2212222

2222122

2222221

TMTR R1

kucg.korea.ac.kr

KUCG

Graphics Lab @ Korea University

Example

Rotation about z axis Set the unit quaternion: Substitute a=b=0, c=sin(θ/2) into the matrix:

2

sin1 ,0 ,0 ,2

cos

vs

100

0cossin

0sincos

100

02

sin212

sin2

cos2

02

sin2

cos22

sin21

2

2

RM

sin2

sin2

cos2

cos2

sin21 2