64
Computer Graphics Computer Graphics - Transformation - - Transformation - Hanyang University Jong-Il Park

Computer Graphics - Transformation - Hanyang University Jong-Il Park

Embed Size (px)

Citation preview

Page 1: Computer Graphics - Transformation - Hanyang University Jong-Il Park

Computer GraphicsComputer Graphics- Transformation -- Transformation -

Hanyang University

Jong-Il Park

Page 2: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

ObjectivesObjectives

Introduce standard transformations Rotation Translation Scaling Shear

Derive homogeneous coordinate transformation matrices

Learn to build arbitrary transformation matrices from simple transformations

Learn how to carry out transformations in OpenGL Introduce OpenGL matrix modes

Model-view Projection

Page 3: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

General TransformationsGeneral Transformations

A transformation maps points to other points and/or vectors to other vectors

Q=T(P)

v=T(u)

Page 4: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Affine TransformationsAffine Transformations

Line preserving Characteristic of many physically important

transformations Rigid body transformations: rotation, translation Scaling, shear

Importance in graphics is that we need only transform endpoints of line segments

and let implementation draw line segment between the

transformed endpoints

Page 5: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Pipeline ImplementationPipeline Implementation

transformation rasterizer

u

v

u

v

T

T(u)

T(v)

T(u)

T(u)

T(v)

T(v)

vertices vertices pixels

framebuffer

(from application program)

Page 6: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

NotationNotation

We will be working with both coordinate-free representations of transformations and representations within a particular frame

P,Q, R: points in an affine space u, v, w: vectors in an affine space , , : scalars p, q, r: representations of points

-array of 4 scalars in homogeneous coordinates

u, v, w: representations of points-array of 4 scalars in homogeneous coordinates

Page 7: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

TranslationTranslation

Move (translate, displace) a point to a new location

Displacement determined by a vector d Three degrees of freedom P’=P+d

P

P’

d

Page 8: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

How many ways?How many ways?

Although we can move a point to a new location in infinite ways, when we move many points there is usually only one way

object translation: every point displaced by same vector

Page 9: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Translation Using RepresentationsTranslation Using Representations

Using the homogeneous coordinate representation in some frame

p=[ x y z 1]T

p’=[x’ y’ z’ 1]T

d=[dx dy dz 0]T

Hence p’ = p + d or

x’=x+dx

y’=y+dy

z’=z+dznote that this expression is in four dimensions and expressespoint = vector + point

Page 10: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Translation MatrixTranslation Matrix

We can also express translation using a 4 x 4 matrix T in homogeneous coordinates

p’=Tp

where

T = T(dx, dy, dz) =

This form is better for implementation because all affine transformations can be expressed this way and multiple transformations can be concatenated together

1000

d100

d010

d001

z

y

x

Page 11: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Rotation (2D)Rotation (2D)

Consider rotation about the origin by degrees radius stays the same, angle increases by

x’=x cos –y sin y’ = x sin + y cos

x = r cos y = r sin

x’ = r cos (y’ = r sin (

Page 12: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Rotation about the Rotation about the zz axis axis

Rotation about z axis in three dimensions leaves all points with the same z Equivalent to rotation in two dimensions in planes of

constant z

or in homogeneous coordinates

p’=Rz()p

x’=x cos –y sin y’ = x sin + y cos z’ =z

Page 13: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Rotation MatrixRotation Matrix

1000

0100

00 cossin

00sin cos

R = Rz() =

Page 14: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Rotation about Rotation about xx and and yy axes axes Same argument as for rotation about z axis

For rotation about x axis, x is unchanged For rotation about y axis, y is unchanged

R = Rx() =

R = Ry() =

1000

0 cos sin0

0 sin- cos0

0001

1000

0 cos0 sin-

0010

0 sin0 cos

Page 15: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Non-rigid-body TransformationsNon-rigid-body Transformations

Page 16: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

ScalingScaling

1000

000

000

000

z

y

x

s

s

s

S = S(sx, sy, sz) =

x’=sxxy’=syxz’=szx

p’=Sp

Expand or contract along each axis (fixed point of origin)

Page 17: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

ReflectionReflection

corresponds to negative scale factors

originalsx = -1 sy = 1

sx = -1 sy = -1 sx = 1 sy = -1

Page 18: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

InversesInverses

Although we could compute inverse matrices by general formulas, we can use simple geometric observations Translation: T-1(dx, dy, dz) = T(-dx, -dy, -dz)

Rotation: R -1() = R(-) Holds for any rotation matrix Note that since cos(-) = cos() and sin(-)=-

sin()

R -1() = R T()

Scaling: S-1(sx, sy, sz) = S(1/sx, 1/sy, 1/sz)

Page 19: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Linear TransformationsLinear Transformations

x' = Ax + By + Cz + D

y' = Ex + Fy + Gz + H

z' = Ix + Jy + Kz + L

Transform the geometry – leave the topology as is

Page 20: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Geometry vs. TopologyGeometry vs. Topology

Page 21: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Transformations in H.C.Transformations in H.C.

Page 22: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Identity MatrixIdentity Matrix

Page 23: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Matrix InverseMatrix Inverse

Page 24: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

TranslationTranslation

Page 25: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

2D Rotation2D Rotation

Page 26: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

3D Rotation about Z3D Rotation about Z

Page 27: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

3D Rotation about X & Y3D Rotation about X & Y

About X

About Y

Page 28: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

ConcatenationConcatenation

We can form arbitrary affine transformation matrices by multiplying together rotation, translation, and scaling matrices

Because the same transformation is applied to many vertices, the cost of forming a matrix M=ABCD is not significant compared to the cost of computing Mp for many vertices p

The difficult part is how to form a desired transformation from the specifications in the application

Page 29: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Order of TransformationsOrder of Transformations Note that matrix on the right is the first applied Mathematically, the following are equivalent p’ = ABCp = A(B(Cp)) Note many references use column matrices to

represent points. In terms of column matrices p’T = pTCTBTAT

Page 30: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

General Rotation About the OriginGeneral Rotation About the Origin

x

z

y

v

A rotation by about an arbitrary axiscan be decomposed into the concatenationof rotations about the x, y, and z axes

R() = Rz(z) Ry(y) Rx(x)

x y z are called the Euler angles

Note that rotations do not commuteWe can use rotations in another order butwith different angles

Page 31: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

GeneralGeneral RotationRotation

Read Sect. 4.9.4.

Page 32: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Rotation About a Fixed Point other Rotation About a Fixed Point other than the Originthan the Origin

1. Move fixed point to origin

2. Rotate

3. Move fixed point back

M = T(pf) R() T(-pf)

Page 33: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

InstancingInstancing

In modeling, we often start with a simple object centered at the origin, oriented with the axis, and at a standard size

We apply an instance transformation to its vertices to

Scale

Orient

Locate

Page 34: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

ShearShear

Helpful to add one more basic transformation Equivalent to pulling faces in opposite

directions

Page 35: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Shear MatrixShear Matrix

Consider simple shear along x axis

x’ = x + y cot y’ = yz’ = z

1000

0100

0010

00cot 1

H() =

Page 36: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Matrix Multiplication Is NOT Matrix Multiplication Is NOT CommutativeCommutative

Page 37: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Combining Translations, RotationsCombining Translations, Rotations

' ( )P TR P MP RP T

11 12 13 11 12 13

21 22 23 21 22 23

31 32 33 31 32 33

1 0 0 0

0 1 0 0

0 0 1 0 0 1

0 0 0 1 0 0 0 1 0 0 0 1

x x

y y

z z

T R R R R R R T

T R R R R R R T R TM

T R R R R R R T

Page 38: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Combining Translations, RotationsCombining Translations, Rotations

' ( ) ( )P RT P MP R P T RP RT

11 12 13

3 3 3 3 3 121 22 23

1 331 32 33

0 1 0 0

0 0 1 0

0 10 0 0 1

0 0 0 1 0 0 0 1

x

y

z

R R R T

R R TR R R TM

R R R T

Page 39: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Matrix Multiplication Is Matrix Multiplication Is AssociativeAssociative

Page 40: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Transformation GameTransformation Game

transformation_game.jar

http://www.cs.brown.edu/exploratories/freeSoftware/catalogs/repositoryApplets.html

Page 41: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

OpenGL MatricesOpenGL Matrices In OpenGL matrices are part of the state Multiple types

Model-View (GL_MODELVIEW) Projection (GL_PROJECTION) Texture (GL_TEXTURE) (ignore for now) Color(GL_COLOR) (ignore for now)

Single set of functions for manipulation Select which to be manipulated by

glMatrixMode(GL_MODELVIEW); glMatrixMode(GL_PROJECTION);

Page 42: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Current Transformation Matrix (CTM)Current Transformation Matrix (CTM)

Conceptually there is a 4 x 4 homogeneous coordinate matrix, the current transformation matrix (CTM) that is part of the state and is applied to all vertices that pass down the pipeline

The CTM is defined in the user program and loaded into a transformation unit

CTMvertices verticesp p’=Cp

C

Page 43: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Concatenation of TransformationsConcatenation of Transformations

Page 44: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Hardware can do this very quickly!

Page 45: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

CTM operationsCTM operations

The CTM can be altered either by loading a new CTM or by postmutiplication

Load an identity matrix: C ILoad an arbitrary matrix: C M

Load a translation matrix: C TLoad a rotation matrix: C RLoad a scaling matrix: C S

Postmultiply by an arbitrary matrix: C CM

Postmultiply by a translation matrix: C CTPostmultiply by a rotation matrix: C C RPostmultiply by a scaling matrix: C C S

Page 46: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Rotation about a Fixed PointRotation about a Fixed PointStart with identity matrix: C IMove fixed point to origin: C CTRotate: C CRMove fixed point back: C CT -1

Result: C = TR T –1 which is backwards.

This result is a consequence of doing postmultiplications.Let’s try again.

Page 47: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Reversing the OrderReversing the Order

We want C = T –1 R T so we must do the operations in the following order

C IC CT -1

C CRC CT

Each operation corresponds to one function call in the program.

Note that the last operation specified is the first executed in the program

Page 48: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

CTM in OpenGL CTM in OpenGL

OpenGL has a model-view and a projection matrix in the pipeline which are concatenated together to form the CTM

Can manipulate each by first setting the correct matrix mode

Page 49: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Rotation, Translation, ScalingRotation, Translation, Scaling

glRotatef(theta, vx, vy, vz)

glTranslatef(dx, dy, dz)

glScalef( sx, sy, sz)

glLoadIdentity()

Load an identity matrix:

Multiply on right:

theta in degrees, (vx, vy, vz) define axis of rotation

Each has a float (f) and double (d) format (glScaled)

Page 50: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

ExampleExample

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

glMatrixMode(GL_MODELVIEW);glLoadIdentity();glTranslatef(1.0, 2.0, 3.0);glRotatef(30.0, 0.0, 0.0, 1.0);glTranslatef(-1.0, -2.0, -3.0);

Page 51: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Compound TransformationCompound Transformation

Page 52: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Arbitrary MatricesArbitrary Matrices

Can load and multiply by matrices defined in the application program

The matrix m is a one dimension array of 16 elements which are the components of the desired 4 x 4 matrix stored by columns

In glMultMatrixf, m multiplies the existing matrix on the right

glLoadMatrixf(m)glMultMatrixf(m)

Page 53: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Matrix StacksMatrix Stacks

In many situations we want to save transformation matrices for use later Traversing hierarchical data structures (Chapter 10) Avoiding state changes when executing display lists

OpenGL maintains stacks for each type of matrix Access present type (as set by glMatrixMode) by

glPushMatrix()glPopMatrix()

Page 54: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Reading Back MatricesReading Back Matrices

Can also access matrices (and other parts of the state) by query functions

For matrices, we use as

glGetIntegervglGetFloatvglGetBooleanvglGetDoublevglIsEnabled

double m[16];glGetFloatv(GL_MODELVIEW, m);

Page 55: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Using TransformationsUsing Transformations

Example: use idle function to rotate a cube and mouse function to change direction of rotation

Start with a program that draws a cube (colorcube.c) in a standard way Centered at origin Sides aligned with axes

Page 56: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

main.c main.c

void main(int argc, char **argv) { glutInit(&argc, argv); glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB | GLUT_DEPTH); glutInitWindowSize(500, 500); glutCreateWindow("colorcube"); glutReshapeFunc(myReshape); glutDisplayFunc(display); glutIdleFunc(spinCube); glutMouseFunc(mouse); glEnable(GL_DEPTH_TEST); glutMainLoop();}

Page 57: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Idle and Mouse callbacksIdle and Mouse callbacks

void spinCube() {

theta[axis] += 2.0;if( theta[axis] > 360.0 ) theta[axis] -= 360.0;glutPostRedisplay();

}

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;}

Page 58: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Display callbackDisplay callback

void display(){ 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();}

Note that because of fixed form of callbacks, variables

such as theta and axis must be defined as globals

Camera information is in standard reshape callback

Page 59: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Using the Model-view MatrixUsing the Model-view Matrix In OpenGL the model-view matrix is used to

Position the camera Can be done by rotations and translations but

is often easier to use gluLookAt Build models of objects

The projection matrix is used to define the view volume and to select a camera lens

Page 60: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Model-view and Projection MatricesModel-view and Projection Matrices

Although both are manipulated by the same functions, we have to be careful because incremental changes are always made by postmultiplication For example, rotating model-view and projection

matrices by the same matrix are not equivalent operations. Postmultiplication of the model-view matrix is equivalent to premultiplication of the projection matrix

Page 61: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Smooth RotationSmooth Rotation

From a practical standpoint, we are often want to use transformations to move and reorient an object smoothly Problem: find a sequence of model-view matrices

M0,M1,…..,Mn so that when they are applied successively to one or more objects we see a smooth transition

For orientating an object, we can use the fact that every rotation corresponds to part of a great circle on a sphere Find the axis of rotation and angle Virtual trackball (see text)

Page 62: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

Incremental Rotation Incremental Rotation

Consider the two approaches For a sequence of rotation matrices R0,R1,…..,Rn , find

the Euler angles for each and use Ri= Riz Riy Rix

Not very efficient

Use the final positions to determine the axis and angle of rotation, then increment only the angle

Quaternions can be more efficient than either

Page 63: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

QuaternionsQuaternions Extension of imaginary numbers from two to

three dimensions Requires one real and three imaginary

components i, j, k

Quaternions can express rotations on sphere smoothly and efficiently. Process: Model-view matrix quaternion Carry out operations with quaternions Quaternion Model-view matrix

q=q0+q1i+q2j+q3k

Page 64: Computer Graphics - Transformation - Hanyang University Jong-Il Park

            

Division of Electrical and Computer Engineering, Hanyang University

InterfacesInterfaces One of the major problems in interactive

computer graphics is how to use two-dimensional devices such as a mouse to interface with three dimensional objects

Example: how to form an instance matrix? Some alternatives

Virtual trackball 3D input devices such as the spaceball Use areas of the screen

Distance from center controls angle, position, scale depending on mouse button depressed