Modeling with OpenGL Practice with OpenGL transformations

Intent Learn OpenGL matrix operations Model a 3D world ◦ Use quads, lines, triangles,cubes, spheres and other primitives ◦ Apply Color ◦ Translation, Rotation, Scale ◦ OpenGL stae machine, saving state, restoring Set up a Camera Set up a Projection

Setting up OpenGL for MS VC++ Copy & Paste : glut32.dll to %WinDir%\System, glut32.lib to $(MSDevDir)\..\..\VC98\lib, and glut.h to $(MSDevDir)\..\..\VC98\include\GL.

Setting up for MS VC Copy & Paste : glut32.dll to %WinDir%\System, glut32.lib to..\Program Files\Microsoft Visual Studio 9.0\VC\lib and glut.h to..\Program Files\Microsoft Visual Studio 9.0\include\GL. (create GL directory if not present)

Beginning Open Visual Studio File >> New >> Project

Press Ctrl + F5

Adding OpenGL Codes #include using namespace std;

Adding OpenGL code int main(int argc, char **argv) { glutInit(&argc,argv); glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB); glutInitWindowSize (900,900); glutInitWindowPosition (0, 0); glutCreateWindow("Hello 3D"); init(); // init display modes glutDisplayFunc(display); // display update glutMainLoop(); return 0; }

Adding OpenGL code Write init(), display() functions void display() { glClear(GL_COLOR_BUFFER_BIT); // ….. // write display codes … // ……. glFlush(); // update display }

Init() void init(void) { glClearColor(0.0,0.0,0.0,0.0); // black color //set up projection mode }

The Skeleton Program

Run It

Now, what to do ? Add some models Add Camera Add Projection Perspective Projection

Add some models Hand-sketch or draw a story board

Add some models Suppose this is our world

Add some models Suppose this is our world A field of 30X30 size A cube centered at (5,1,5) This structure base at -8,0,8 This axes

Add the field

void display() { glClear(GL_COLOR_BUFFER_BIT); // ….. // write display codes … glMatrixMode(GL_MODELVIEW); glColor3f(1.0,1.0,1.0); //white glBegin(GL_LINE_LOOP); glVertex3f(-15.0,0.0,15.0); glVertex3f(15.0,0.0,15.0); glVertex3f(15.0,0.0,-15.0); glVertex3f(-15.0,0.0,-15.0); glEnd(); // ……. glFlush(); // update display }

Add the cube void display() { glClear(GL_COLOR_BUFFER_BIT); // ….. // write display codes … glMatrixMode(GL_MODELVIEW); glColor3f(1.0,1.0,1.0); //white glBegin(GL_LINE_LOOP); glVertex3f(-15.0,0.0,15.0); glVertex3f(15.0,0.0,15.0); glVertex3f(15.0,0.0,-15.0); glVertex3f(-15.0,0.0,-15.0); glEnd(); glTranslated(5.0,1.0,5.0); glutWireCube(1.0); // ……. glFlush(); // update display }

What about viewing ? Want to view what we have done so far Press Ctrl + F5 Code will compile and Run

What about viewing ? What do you find ? ◦ Nothing ◦ Whats the problem ? No view !! No projection !!

Add a view Add view code

Add a view

glMatrixMode(GL_MODELVIEW); glLoadIdentity(); gluLookAt( ?? ); From where we are looking at ? To where we are looking ??

Add a view

It seems we are looking at the origin (0,0,0) from a bit distant…and high Say, eye position at (25,25,-25) focus at (0,0,0)

Add a view glMatrixMode(GL_MODELVIEW); glLoadIdentity(); gluLookAt( 25.0,25.0,-25.0, 0.0,0.0,0.0, 0.0,1.0,0.0 ); Should we be able to get some output if we run now ? No

Add Projection Add projection code

Now Run Ctrl + F5 Correct Compile Running…

Adding the axes glColor3f(0.3,0.3,0.3); glBegin(GL_LINES); glVertex3f(0.0,0.0,-15.0); glVertex3f(0.0,0.0,15.0); glEnd(); glBegin(GL_LINES); glVertex3f(-15.0,0.0,0.0); glVertex3f(15.0,0.0,0.0); glEnd(); glColor3f(1.0,1.0,1.0);

Run

Adding a grid glMatrixMode(GL_MODELVIEW); glColor3f(0.3,0.3,0.3); #define EXTX 14 #define EXTZ 14 glBegin(GL_LINES); double x = -(double)EXTX; for(int i = 1; i<=2*EXTX+1; i++) glVertex3f(x,0.0,-15.0); glVertex3f(x,0.0,15.0); x += 1.0; } glEnd(); glBegin(GL_LINES); double z = -(double)EXTZ; for(int i = 1; i<=2*EXTZ+1; i++) { glVertex3f(-15.0,0.0,z); glVertex3f(15.0,0.0,z); z += 1.0; } glEnd(); glColor3f(1.0,1.0,1.0); // white

Run

What about moving the camera ;-) It looks like a film storyboard Let us animate the camera around the field in a circle of radius 25 at XZ plane

Moving the camera Enable double buffer and add a mouse function int main(int argc, char **argv) { glutInit(&argc,argv); glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB); glutInitWindowSize (900,900); glutInitWindowPosition (0, 0); glutCreateWindow("Hello 3D"); init(); // init display modes glutDisplayFunc(display); // display update glutMouseFunc(mouse); glutMainLoop(); return 0; }

Moving the camera Enable camera animation when mouse clicked void mouse(int button, int state, int x, int y) { switch(button) { case GLUT_LEFT_BUTTON: if(state==GLUT_DOWN) glutIdleFunc(spinDisplay); break; case GLUT_MIDDLE_BUTTON: if(state==GLUT_DOWN) glutIdleFunc(NULL); break; default: break; }

Moving the camera SpinDisplay will be called whenever idle Add a global variable camera_angle Write the spinDisplay() function to update camera angle void spinDisplay(void) { camera_angle = camera_angle + 0.2; if(camera_angle > 360.0) camera_angle = camera_angle ; glutPostRedisplay(); }

Change the camera code Add a circle equation for camera glMatrixMode(GL_MODELVIEW); glLoadIdentity(); #define PI double eyex = 25.0*cos(camera_angle*PI/180.0); double eyez = 25.0*sin(camera_angle*PI/180.0); gluLookAt( eyex,25.0,-eyez, 0.0,0.0,0.0, 0.0,1.0,0.0 ); At the end change glFlush() by glutSwapBuffers();

Moving the camera Run it … Click the mouse Check that the camera is moving ◦ Don’t be confused, here model is static ◦ Only camera is moving Later we will do things, where model will also move, camera may or may not move

Adding one more model Intent it ◦ Translate to (-8,0,8) ◦ Draw it

Adding one more model void drawHighTriangle() { glBegin(GL_LINE_LOOP); glVertex3f(0.0,0.0,0.0); glVertex3f(0.0,1.0,0.0); glVertex3f(1.0,0.0,0.0); glEnd(); glBegin(GL_LINE_LOOP); glVertex3f(0.0,0.0,0.0); glVertex3f(0.0,1.0,0.0); glVertex3f(0.0,0.0,1.0); glEnd(); }

Adding one more model Now, we want to draw this model at (- 8,0,8) with 5X scaling Should this work ? glTranslated(-8.0,0.0,8.0); glScalef(5.0,5.0,5.0); drawHighTriangle();

Adding one more model Say we have one cube at (5,1,5) Say we draw the cube by : glTranslated(5.0,1.0,5.0); glutWireCube(1.0); Now, how to draw the other model ?? glTranslated(-8.0,0.0,8.0); glScalef(5.0,5.0,5.0); drawHighTriangle(); Now, where this code is going to draw it ??

Order Matters ? glColor3f(0.0,1.0,1.0); glTranslated(-8.0,0.0,8.0); glScalef(5.0,5.0,5.0); drawHighTriangle(); glColor3f(1.0,1.0,0.0); glTranslated(5.0,1.0,5.0); glutWireCube(5.0);

Order Matters ? glColor3f(1.0,1.0,0.0); glTranslated(5.0,1.0,5.0); glutWireCube(5.0); glColor3f(0.0,1.0,1.0); glTranslated(-8.0,0.0,8.0); glScalef(5.0,5.0,5.0); drawHighTriangle();

More.. And if there is rotation … glColor3f(0.0,1.0,1.0); glTranslated(-8.0,0.0,8.0); glScalef(5.0,5.0,5.0); glRotatef(25.0,0.0,0.0,1.0); drawHighTriangle(); glColor3f(1.0,1.0,0.0); glTranslated(5.0,1.0,5.0); glRotatef(45.0,1.0,0.0,0.0); glutWireCube(5.0);

More.. And if there is rotation … glColor3f(1.0,1.0,0.0); glTranslated(5.0,1.0,5.0); glRotatef(45.0,1.0,0.0,0.0); glutWireCube(5.0); glColor3f(0.0,1.0,1.0); glTranslated(-8.0,0.0,8.0); glScalef(5.0,5.0,5.0); glRotatef(25.0,0.0,0.0,1.0); drawHighTriangle();

Why this happens ? OpenGL is a state machine. Proper process ? glPushMatrix(); glColor3f(1.0,1.0,0.0); glTranslated(5.0,1.0,5.0); glutWireCube(5.0); glPopMatrix(); glPushMatrix(); glColor3f(0.0,1.0,1.0); glTranslated(-8.0,0.0,8.0); glScalef(5.0,5.0,5.0); drawHighTriangle(); glPopMatrix();

Transformation in OpenGL  OpenGL uses 3 stacks to maintain transformation matrices:  Model & View transformation matrix stack  Projection matrix stack  Texture matrix stack  You can load, push and pop the stack  The top most matrix from each stack is applied to all graphics primitive until it is changed M N Model-View Matrix Stack Projection Matrix Stack Graphics Primitives (P) Output NMP Transformations in OpenGL

Translation – 2D x’ = x + d x y’ = y + d y Transformations in OpenGL

Transformations and OpenGL ®  Each time an OpenGL transformation M is called the current MODELVIEW matrix C is altered: glTranslatef(1.5, 0.0, 0.0); glRotatef(45.0, 0.0, 0.0, 1.0); Note: v is any vertex placed in rendering pipeline v’ is the transformed vertex from v. Transformations in OpenGL

Order of Transformations T: Translate 20 unit along X  glTranslatef(20.0, 0.0, 0.0); R1 : Rotate 90 degree around X  glRotatef(90,0, 1.0, 0.0, 0.0); T2: Translate 10 unit along Y  glTranslatef(10.0,0.0,1.0, 0.0);  This translation is actually along the global Z axis because after R1, the global Z axis became the Y axis and vice versa.

Saving the state  Transformations have cumulative effect  glPushMatrix() saves present state  glPopMatrix() pops the last pushed state

So how to draw models When we know the position of things around a special orientation/ reference point we can always get back to that using glPushMatrix() and glPopMatrix()

Saving the state

Thinking About Transformations As a Global System  Objects moves but coordinates stay the same  Think of transformation in reverse order as they appear in code As a Local System  Objects moves and coordinates move with it  Think of transformation in same order as they appear in code  There is a World Coordinate System where:  All objects are defined  Transformations are in World Coordinate space Two Different Views Order of Transformations

Local View  Translate Object  Then Rotate Order of Transformation TR glLoadIdentity(); glMultiMatrixf( T); glMultiMatrixf( R); draw_ the_ object( v); v’ = ITRv Global View  Rotate Object  Then Translate Effect is same, but perception is different Order of Transformations

glLoadIdentity(); glMultiMatrixf( R); glMultiMatrixf( T); draw_ the_ object( v); v’ = ITRv Local View  Rotate Object  Then Translate Global View  Translate Object  Then Rotate Effect is same, but perception is different Order of Transformations

Animating Models Previously we animated camera Now we animate models Straight forward process ◦ Enable double buffering ◦ Keep an IdleFunction ◦ Update animation data inside idle function ◦ When displaying, render the models using animation data

Animating models glPushMatrix(); glColor3f(1.0,1.0,0.0); glTranslated(5.0,1.0,5.0); glRotatef(angle_1,1.0,0.0,0.0); glutWireCube(5.0); glPopMatrix(); glPushMatrix(); glColor3f(0.0,1.0,1.0); glTranslated(-8.0,0.0,8.0); glScalef(5.0,5.0,5.0); glRotatef(angle_2,0.0,0.0,1.0); drawHighTriangle(); glPopMatrix();

Animating models Inside the idleFunction (here spinDisplay) update animation data void spinDisplay(void) { camera_angle = camera_angle + 1.0; angle_1 += 2.0; angle_3 += 5.0; if(camera_angle > 360.0) camera_angle = camera_angle ; if(angle_1 > 360.0) angle_1 = angle_ ; if(angle_2 > 360.0) angle_2 = angle_ ; glutPostRedisplay(); }

Thank You