1 / 67

Transformation

Jeff Parker, 2011 Based on lectures by Ed Angel. Transformation. Objectives. Introduce standard transformations Rotation Translation Scaling Shear Learn to build arbitrary transformation matrices from simple transformations Look at some 2 dimensional examples, with an excursion to 3D

jolie
Download Presentation

Transformation

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Jeff Parker, 2011 Based on lectures by Ed Angel Transformation

  2. Objectives • Introduce standard transformations • Rotation • Translation • Scaling • Shear • Learn to build arbitrary transformation matrices from simple transformations • Look at some 2 dimensional examples, with an excursion to 3D • We start with a simple example to motivate this

  3. Using transformations void display() { ... setColorBlue(); drawDisc(); setColorRed(); glTranslatef(8,0,0); drawDisc(); setColorGreen(); glTranslatef(-3,2,0); glScalef(2,2,2); drawDisc(); glFlush(); }

  4. General Transformations Transformation maps points to other points and/or vectors to other vectors v=T(u) Q=T(P)

  5. Non-Rigid Transformations

  6. Ocean Sunfish The Ocean Sunfish is the world's heaviest known bony fish Adapted from Thomas D'Arcy's On Growth and Form

  7. 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

  8. Pipeline Implementation v T frame buffer u T(u) transformation rasterizer T(v) T(v) T(v) v T(u) u T(u) vertices pixels vertices

  9. Affine Transformations • We want our transformations to be 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 • Let implementation draw line segment between the transformed endpoints

  10. Translation • Move (translate, displace) a point to a new location • Displacement determined by a vector d • P’=P+d P’ d P

  11. Not Commutative • While often A x B = B x A, transformations are not usually commutative • If I take a step left, and then turn left, not the same as • Turn left, take a step left • This is fundamental, and cannot be patched or fixed.

  12. Rotations in 2D • We wish to take triplets (x, y) and map them to new points (x', y') • While we will want to introduce operations that change scale, we will start with rigid body translations • Translation (x, y)  (x + deltaX, y) • Translation (x, y)  (x + deltaX, y + deltaY) • Rotation (x, y)  ? • Insight: fix origin, and track (1, 0) and (0, 1) as we rotate through angle a

  13. Rotations • Any point (x, y) can be expressed in terms of (1, 0), (0, 1) • e.g. (12, 15) = 12*(1,0) + 15*(0, 1) • These unit vectors form a basis • The coordinates of the rotation of T(1, 0) = (cos(a), sin(a)) • The coordinates of the rotation of T(0, 1) = (-sin(a), cos(a)) • The coordinates of T (x, y) = (x cos(a) + y sin(a), -x sin(a) + y cos(a)) • Each term of the result is a dot product • (x, y) • ( cos(a), sin(a)) = (x cos(a) - y sin(a)) • (x, y) • (-sin(a), cos(a)) = (x sin(a) + y cos(a))

  14. Matrices • Matrices provide a compact representation for rotations, and many other transformation • T (x, y) = (x cos(a) - y sin(a), x sin(a) + y cos(a)) • To multiply matrices, multiply the rows of first by the columns of second

  15. Determinant • If the length of each column is 1, the matrix preserves the length of vectors (1, 0) and (0, 1) • We also will look at the Determinant. Determinant of a rotation is 1.

  16. 3D Matrices • Can act on 3 space • T (x, y, z) = (x cos(a) + y sin(a), -x sin(a) + y cos(a), z) • This is called a "Rotation about the z axis" – z values are unchanged

  17. 3D Matrices • Can rotate about other axes • Can also rotate about other lines through the origin… • Can perform rotations in order • Any rotation is the produce of three of these rotations • Euler Angles • Not unique Euler Angles Wikipedia

  18. Euler Angles • The Euler Angles for a rotation are not unique Euler Angles Wikipedia

  19. Scaling Expand or contract along each axis (fixed point of origin) S = S(sx, sy, sz) = x’=sxx y’=syx z’=szx p’=Sp

  20. Reflection Reflection corresponds to negative scale factors Example below sends (x, y, z)  (-x, y, z) Note that the product of two reflections is a rotation sx = -1 sy = 1 original sx = -1 sy = -1 sx = 1 sy = -1

  21. Limitations • We cannot define a translation in 2D space with a 2x2 matrix • There are no choices for a, b, c, and d that will move the origin, (0, 0), to some other point, such as (5, 3) in the equation above • Further, we will see that perspective can not be handled by a matrix operation alone • We will find ways to get around each of these problems

  22. Image Formation We can describe movement with a matrix Or implicitly, as below Ask for what we want… glTranslatef(8,0,0); glTranslatef(-3,2,0); glScalef(2,2,2); • There are still some surprises

  23. Using transformations void display() { ... setColorBlue(); drawDisc(); setColorRed(); glTranslatef(8,0,0); drawDisc(); setColorGreen(); glTranslatef(-3,2,0); glScalef(2,2,2); drawDisc(); glFlush(); }

  24. Absolute vs Relative move void display() { ... setColorRed(); glTranslatef(8,0,0); ... glTranslatef(-3,2,0); glScalef(2,2,2); drawDisc(); • void display() • { • ... • setColorBlue(); • glLoadIdentity(); • drawDisc(); • setColorRed(); • glLoadIdentity(); /* Not really needed... */ • glTranslatef(8,0,0); • drawDisc(); • setColorGreen(); • glLoadIdentity(); /* Return to known position */ • glTranslatef(5,2,0); • glScalef(2,2,2); • drawDisc(); • glFlush(); • } With absolute placement, don't need to remember where we were before

  25. Order of Transformations • Note that matrix on the right is the first applied to the point p • Mathematically, the following are equivalent p’ = ABCp = A(B(Cp)) • We use column matrices to represent points. In terms of row matrices p’T = pTCTBTAT • That is, the "last" transformation is applied first. • We will see that the implicit transformations have the same order property

  26. Rotation About a Fixed Point other than the Origin Move fixed point to origin Rotate Move fixed point back M = T(pf) R(q) T(-pf)

  27. Instancing • 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 (rotate) Locate (translate)

  28. Example • void display() • { • ... • setColorGreen(); • glLoadIdentity(); • glTranslatef(5,2,0); • glRotatef(45.0, 0.0, 0.0, 1.0); /* z axis */ • glScalef(2,4,0); • drawDisc(); • ... • }

  29. Match image to code The most recently applied transformation works first • setColorGreen(); • glLoadIdentity(); • glRotatef(45.0, 0.0, 0.0, 1.0); /* z axis */ • glTranslatef(5,2,0); • glScalef(2,4,0); • drawDisc(); setColorGreen(); glLoadIdentity(); glTranslatef(5,2,0); glRotatef(45.0, 0.0, 0.0, 1.0); glScalef(2,4,0); drawDisc(); setColorGreen(); glLoadIdentity(); glTranslatef(5,2,0); glScalef(2,4,0); glRotatef(45.0, 0.0, 0.0, 1.0); drawDisc();

  30. Proper Order • setColorGreen(); • glLoadIdentity(); • glRotatef(45.0, 0.0, 0.0, 1.0); /* z axis */ • glTranslatef(5,2,0); • glScalef(2,4,0); • drawDisc(); setColorGreen(); glLoadIdentity(); glTranslatef(5,2,0); glRotatef(45.0, 0.0, 0.0, 1.0); glScalef(2,4,0); drawDisc(); setColorGreen(); glLoadIdentity(); glTranslatef(5,2,0); glScalef(2,4,0); glRotatef(45.0, 0.0, 0.0, 1.0); drawDisc();

  31. Example • Be sure to play with Nate Robin's Transformation example

  32. Matrix Stack • It is useful to be able to save the current transformation • We can push the current state on a stack, and then • Make new scale, translations, rotations transformations • Then pop the stack and return to status quo ante

  33. Example

  34. Example • Image is made up of subimages

  35. Rings • void display() • { • int angle; • glClear(GL_COLOR_BUFFER_BIT); • for (angle = 0; angle < 360; angle = angle + STEP) • { • glPushMatrix(); /* Remember current state */ • glRotated(angle, 0, 0, 1); • glTranslatef(0.0, 0.75, 0.0); • glScalef(0.15, 0.15, 0.15); • drawRing(); • glPopMatrix(); /* Restore orignal state */ • } • glFlush(); • }

  36. Rings • /* Draw 12 rings */ • void display() • { • int angle; • // glClear(GL_COLOR_BUFFER_BIT); • for (angle = 0; angle < 360; angle = angle + STEP) • { • glPushMatrix(); /* Remember current state */ • glRotated(angle, 0, 0, 1); • glTranslatef(0.0, 0.75, 0.0); • glScalef(0.15, 0.15, 0.15); • drawRing(); • glPopMatrix(); /* Restore orignal state */ • } • glFlush(); • }

  37. drawRing • /* Draw 12 triangles to form one ring */ • void drawRing() • { • int angle; • for (angle = 0; angle < 360; angle = angle + STEP) • { • glPushMatrix(); /* Remember current state */ • glRotated(angle, 0, 0, 1); • glTranslatef(0.0, 0.75, 0.0); • glScalef(0.2, 0.2, 0.2); • glColor3f((float)angle/360, 0, 1.0-((float)angle/360)); • drawTriangle(); • glPopMatrix(); /* Restore orignal state */ • } • glFlush(); • }

  38. Jon Squire's fractalgl uses the Matrix Stack Tree This is harder to do from scratch

  39. Shear • Helpful to add one more basic transformation • Equivalent to pulling faces in opposite directions

  40. Shear Matrix Consider simple shear along x axis x’ = x + y cot q y’ = y z’ = z H(q) =

  41. 3D Rotation example // Vertices of a unit cube centered at origin point4 vertices[8] = { point4( -0.5, -0.5, 0.5, 1.0 ), point4( -0.5, 0.5, 0.5, 1.0 ), point4( 0.5, 0.5, 0.5, 1.0 ), point4( 0.5, -0.5, 0.5, 1.0 ), point4( -0.5, -0.5, -0.5, 1.0 ), point4( -0.5, 0.5, -0.5, 1.0 ), point4( 0.5, 0.5, -0.5, 1.0 ), point4( 0.5, -0.5, -0.5, 1.0 ) };

  42. Cube corners // generate 12 triangles: 36 vertices and 36 colors void colorcube() { quad( 1, 0, 3, 2 ); quad( 2, 3, 7, 6 ); quad( 3, 0, 4, 7 ); quad( 6, 5, 1, 2 ); quad( 4, 5, 6, 7 ); quad( 5, 4, 0, 1 ); }

  43. Colors // RGBA olors color4 vertex_colors[8] = { color4( 0.0, 0.0, 0.0, 1.0 ), // black color4( 1.0, 0.0, 0.0, 1.0 ), // red color4( 1.0, 1.0, 0.0, 1.0 ), // yellow color4( 0.0, 1.0, 0.0, 1.0 ), // green color4( 0.0, 0.0, 1.0, 1.0 ), // blue color4( 1.0, 0.0, 1.0, 1.0 ), // magenta color4( 1.0, 1.0, 1.0, 1.0 ), // white color4( 0.0, 1.0, 1.0, 1.0 ) // cyan };

  44. Mixing color and corner // Vertices of a unit cube centered at origin point4 vertices[8] = { point4( -0.5, -0.5, 0.5, 1.0 ), ... // RGBA olors color4 vertex_colors[8] = { color4( 0.0, 0.0, 0.0, 1.0 ), // black ... // quad generates two triangles for each face // and assigns colors to the vertices int Index = 0; void quad( int a, int b, int c, int d ) { colors[Index] = vertex_colors[a]; points[Index] = vertices[a]; Index++;

  45. Mixing color and corner // quad generates two triangles for each face // and assigns colors to the vertices int Index = 0; void quad( int a, int b, int c, int d ) { colors[Index] = vertex_colors[a]; points[Index] = vertices[a]; Index++; colors[Index] = vertex_colors[b]; points[Index] = vertices[b]; Index++; colors[Index] = vertex_colors[c]; points[Index] = vertices[c]; Index++; colors[Index] = vertex_colors[a]; points[Index] = vertices[a]; Index++; colors[Index] = vertex_colors[c]; points[Index] = vertices[c]; Index++; colors[Index] = vertex_colors[d]; points[Index] = vertices[d]; Index++; }

  46. Spin GLfloat Theta[NumAxes] = { 0.0, 0.0, 0.0 }; GLuint theta; // The location of the "theta" // shader uniform variable ... theta = glGetUniformLocation( program, "theta" ); ... void display( void ) { glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glUniform3fv( theta, 1, Theta ); glDrawArrays( GL_TRIANGLES, 0, NumVertices ); glutSwapBuffers(); }

  47. Delta Spin void idle( void ) { Theta[Axis] += 0.01; if ( Theta[Axis] > 360.0 ) { Theta[Axis] -= 360.0; } glutPostRedisplay(); } int main( int argc, char **argv ) { ... glutIdleFunc( idle );

  48. Change axis // Array of rotation angles for each axis • GLfloat Theta[NumAxes] = { 0.0, 0.0, 0.0 }; enum { Xaxis = 0, Yaxis = 1, Zaxis = 2, NumAxes = 3 }; int Axis = Xaxis; void mouse( int button, int state, int x, int y ) { if ( state == GLUT_DOWN ) { switch( button ) { case GLUT_LEFT_BUTTON: Axis = Xaxis; break; case GLUT_MIDDLE_BUTTON: Axis = Yaxis; break; case GLUT_RIGHT_BUTTON: Axis = Zaxis; break; } } } The Euler Angles do not give the rotations you might expect

  49. Change axis void mouse( int button, int state, int x, int y ) { if ( state == GLUT_DOWN ) { switch( button ) { case GLUT_LEFT_BUTTON: Axis = Xaxis; break; case GLUT_MIDDLE_BUTTON: Axis = Yaxis; break; case GLUT_RIGHT_BUTTON: Axis = Zaxis; break; ... // One button alternative void mouse( int button, int state, int x, int y ) { if ( state == GLUT_DOWN ) { Axis = Axis + 1; if (Axis == NumAxes) Axis = Xaxis; }

  50. Main Program int main( int argc, char **argv ) { glutInit( &argc, argv ); glutInitDisplayMode( GLUT_RGBA | GLUT_DOUBLE | GLUT_DEPTH ); glutInitWindowSize( 512, 512 ); glutCreateWindow( "Color Cube" ); init(); glutDisplayFunc( display ); glutKeyboardFunc( keyboard ); glutMouseFunc( mouse ); glutIdleFunc( idle ); glutMainLoop(); return 0; }

More Related