Transformation Example

Order of Transformation Matters Scale, translate Scale, translate Translate scale Translate scale Rotate, Translate Rotate, Translate Translate, Rotate Translate, Rotate

An Example Line (A,B), A=(0,0,0) B=(1,0,0) Line (A,B), A=(0,0,0) B=(1,0,0) S=(2,2,1) S=(2,2,1) T=(2,3,0) T=(2,3,0) First Scale, then Translate First Scale, then Translate A’=(0,0,0) B’=(2,0,0); A’’=(2,3,0); B’’=(4,3,0) A’=(0,0,0) B’=(2,0,0); A’’=(2,3,0); B’’=(4,3,0) First Translate, then Scale First Translate, then Scale A’=(2,3,0) B’=(3,3,0); A’’=(4,6,0); B’’=(6,6,0) A’=(2,3,0) B’=(3,3,0); A’’=(4,6,0); B’’=(6,6,0)

A house example

Transformation helps Assume drawHouse( ) draws house #1 Assume drawHouse( ) draws house #1 How can we draw house #2 How can we draw house #2 Rotate first or translate first? Rotate first or translate first? Rotate first Rotate first How can we draw both? How can we draw both? DrawHouse( ); DrawHouse( ); glTranslate.. glTranslate.. glRotate… glRotate… DrawHouse( ); DrawHouse( );

More Houses? House 1 House 1 House1 M2 --  House2 House1 M2 --  House2 House1 M3 --  House3 House1 M3 --  House3

The Matrix Stack glPushMatrix( ) glPushMatrix( ) glPopMatrix( ) glPopMatrix( )

drawHouse( ); drawHouse( ); glPushMatrix( ); //remember the matrix for //drawing house 1 glPushMatrix( ); //remember the matrix for //drawing house 1 …//Apply m2; …//Apply m2; drawHouse( ); //draw house2 drawHouse( ); //draw house2 glPopMatrix( ); //pop the matrix for house 1 glPopMatrix( ); //pop the matrix for house 1 …//Apply m3; …//Apply m3; drawHouse( ); //draw house 3; drawHouse( ); //draw house 3;

for(int i = 0; i < 12; i++){ glMatrixMode(GL_MODELVIEW); glLoadIdentity(); glTranslated(320,240,0); glRotated(i*30, 0,0,1); glTranslated(0, radius, 0); drawPolyLineFile("dino.dat1"); } Correct?

This is the result

Looking at the first two //first //first glMatrixMode(GL_MODELVIEW); glMatrixMode(GL_MODELVIEW); glLoadIdentity(); glLoadIdentity(); glTranslated(320,240,0); glTranslated(320,240,0); glTranslated(radius,0, 0); glTranslated(radius,0, 0); drawPolyLineFile("dino.dat1"); drawPolyLineFile("dino.dat1"); //second //second glMatrixMode(GL_MODELVIEW); glMatrixMode(GL_MODELVIEW); glLoadIdentity(); glLoadIdentity(); glTranslated(320,240,0); glTranslated(320,240,0); glRotated(36,0,0,1); glRotated(36,0,0,1); glTranslated(radius, 0, 0); glTranslated(radius, 0, 0); drawPolyLineFile("dino.dat1"); drawPolyLineFile("dino.dat1");

The Ring for(int i = 0; i < 12; i++){ glMatrixMode(GL_MODELVIEW); glLoadIdentity(); glTranslated(320,240,0); glRotated(i*30, 0,0,1); glTranslated(0, radius, 0); drawPolyLineFile("dino.dat1"); }

The Ring Again: Make Use of Matrix Stack //method 2 //method 2 //use push and pop //use push and popglMatrixMode(GL_MODELVIEW); glLoadIdentity(); glLoadIdentity(); for(int i = 0; i < 10; i++){ for(int i = 0; i < 10; i++){ glPushMatrix(); glPushMatrix(); glTranslated(320,240,0); glTranslated(320,240,0); glRotated(i*36, 0,0,1); glRotated(i*36, 0,0,1); glTranslated(0, radius, 0); glTranslated(0, radius, 0); drawPolyLineFile("dino.dat1"); drawPolyLineFile("dino.dat1"); glPopMatrix(); glPopMatrix(); }

Transformations can be thought of as a change in coordinate system if we specify a sequence of transformations always in terms of a fixed (world) coordinate system, they should be ordered from right-to- left. if we specify a sequence of transformations always in terms of a fixed (world) coordinate system, they should be ordered from right-to- left. But if we think of all transformations in terms of a local (object) coordinate system, they should be ordered from left-to-right. But if we think of all transformations in terms of a local (object) coordinate system, they should be ordered from left-to-right.

Relative Transformation glMatrixMode(GL_MODELVIEW); glMatrixMode(GL_MODELVIEW); glLoadIdentity(); glLoadIdentity(); glTranslated(320,240,0); glTranslated(320,240,0); glTranslated(radius,0, 0); glTranslated(radius,0, 0); drawPolyLineFile("dino.dat1"); drawPolyLineFile("dino.dat1"); //from first to second, read it with coordinate transformation glTranslated(-radius,0, 0); glTranslated(-radius,0, 0); glRotated(36, 0,0,1); glRotated(36, 0,0,1); glTranslated(radius,0, 0); glTranslated(radius,0, 0); drawPolyLineFile("dino.dat1"); drawPolyLineFile("dino.dat1");

The Ring Again: Understand it with Coordinate Transformation //method 3, use relative transformation //method 3, use relative transformation glMatrixMode(GL_MODELVIEW); glMatrixMode(GL_MODELVIEW); glLoadIdentity(); glLoadIdentity(); glTranslated(320,240,0); glTranslated(320,240,0); glTranslated(radius,0, 0); glTranslated(radius,0, 0); drawPolyLineFile("dino.dat1"); drawPolyLineFile("dino.dat1"); //draw the rest 9 //draw the rest 9 for(int i=0; i < 9; i++) for(int i=0; i < 9; i++) { { glTranslated(-radius,0, 0); glTranslated(-radius,0, 0); glRotated(36, 0,0,1); glRotated(36, 0,0,1); glTranslated(radius,0, 0); glTranslated(radius,0, 0); drawPolyLineFile("dino.dat1"); drawPolyLineFile("dino.dat1"); } }

How to get this with both translation and rotation?

Using Transformation to Draw

for (int count = 0; count <6; count++)…..//draw a snow flake { flakeMotif(); glScalef(1.0,-1.0,1.0);.//reflection, using scale (1,-1,1) flakeMotif(); glScalef(1,-1,1);.// glScalef(1.0,-1.0,1.0);.//reflect back glRotate(60,0,0,1); } Draw One Snow Flake

Snow Flakes While (!bored) { drawSnowFlakes(); ….//moving to a new spot }

Polyspirals

Pseudocode for( ) { forward(length,1); // draw a line in the current direction turn(angle); // turn through angle degrees length += increment; // increment the line length }