Upgrade to Pro — share decks privately, control downloads, hide ads and more …

SER332 Lecture 11

SER332 Lecture 11

Introduction to Graphics and Game Development
Projection Transformation
(201804)

B546a9b97d993392e4b22b74b99b91fe?s=128

Javier Gonzalez
PRO

February 20, 2018
Tweet

More Decks by Javier Gonzalez

Other Decks in Programming

Transcript

  1. jgs SER332 Introduction to Graphics and Game Development Lecture 11:

    Projection Transformation Javier Gonzalez-Sanchez javiergs@asu.edu PERALTA 230U Office Hours: By appointment
  2. jgs Transformations Projection

  3. jgs Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 3

    § X, Y and Z axis § A plane (gray) § Several Pyramids (red, green, blue, and white faces) § Use arrows to navigate Let us move to a 3D World
  4. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 4 jgs

    Step 1 Z-buffering. The Z-buffer stores how far a pixel is away from the camera in camera space (normalized device coordinate, more precisely. Typically, it ranges [0, 1]). Limited precision: 16-bit, 24-bit, and 32-bit depth value The Z-buffer is necessary to resolve visibility: a) Clear the z-buffer b) Enable the z-buffer Commands: § glClear( GL_DEPTH_BUFFER_BIT | … colors … ); § glEnable( GL_DEPTH_TEST ); § glutInitDisplayMode( GLUT_DEPTH | … colors … | … double … );
  5. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 5 jgs

    Example // https://github.com/javiergs/SER332/blob/master/Lecture11/main.c // main int main(int argc, char **argv) { glutInit(&argc, argv); glutInitDisplayMode(GLUT_DEPTH | GLUT_DOUBLE | GLUT_RGBA); glutInitWindowPosition(0, 0); glutInitWindowSize(800, 800); glutCreateWindow("3D"); myInit(); glutSpecialFunc(mySpecial); glutDisplayFunc(myDisplay); glutReshapeFunc(myReshape); glutMainLoop(); return(0); }
  6. jgs Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 6

    // myInit void myInit() { glShadeModel (GL_SMOOTH); glEnable(GL_DEPTH_TEST); createDrawingList(); } Example
  7. jgs Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 7

    // myInit void myInit() { glShadeModel (GL_SMOOTH); // glEnable(GL_DEPTH_TEST); createDrawingList(); } Example
  8. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 8 jgs

    Example // myDisplay void myDisplay(void) { glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glViewport(0, 0, width, height); // projection glMatrixMode(GL_PROJECTION); glLoadIdentity(); // to be continue ... }
  9. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 9 jgs

    Step 2 Set the projection: glMatrixMode(GL_PROJECTION); Two Options a) Orthographic Projection b) Perspective
  10. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 10 jgs

    Orthographic Projection glOrtho (left, right, bottom, top, near, far) § Viewing volume is a box. § Objects appear same size irrespective of their distance from the camera. § Use it to show messages
  11. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 11 jgs

    Perspective Projection gluPerspective (fov, aspectratio, near, far) § Viewing volume is a truncated pyramid. § Farther objects appear small and closer objects appear big. § These commands calculates the projection matrix and multiplies the current projection matrix by it.
  12. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 12 jgs

    Example // myDisplay void myDisplay(void) { glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glViewport(0, 0, width, height); // projection glMatrixMode(GL_PROJECTION); glLoadIdentity(); // glOrtho(-10, 10, -10, 10, -10, 10); -- uncomment it to try gluPerspective(45, ratio, 1, 1000); // to be continue ... }
  13. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 13 jgs

    Example
  14. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 14 jgs

    Notes § Changing the distance between the near and far clipping planes can have a big effect on the dimensions of the view volume and the angle of the projectors, making it tricky to set up a reasonable view volume for a given scene. § Where and how to incorporate it into your program? a) Set once per frame (put it in your display function). Some overhead, but safer b) Set once in init function, and update whenever window resizes
  15. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 15 jgs

    Step 3 § Set the camera parameters before you define other transformations to model objects in the scene. § Set camera transformation once per frame (in case you have to move your camera interactively) § Try to restore camera matrix each frame. Do not accumulate the viewing matrix, the accumulation might be skewed due to accumulation of computational errors glMatrixMode(GL_MODELVIEW);
  16. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 16 jgs

    gluLookAt § Viewing transformation can be specified using the command gluLookAt ( eye_x, eye_y, eye_z, center_x, center_y, center_z, up_x, up_y, up_z ) § It encapsulates a series of rotation and translation commands. Viewing transformation can be specified using following commands too. This, however, makes your life harder! § glTranslate {f,d} (x, y, z) § glRotate {f,d} (angle, x, y, z) § glScale {f,d} (x, y, z)
  17. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 17 jgs

    gluLookAt glMatrixMode(GL_MODELVIEW); glLoadIdentity(); gluLookAt( 0.0, 1.0, 1.0, /* eye is at (0,1,1) */ 0.0, 1.0, 2.0, /* look at point (0,1,2), viewing direction vector is (0,0,1) */ 0.0, 1.0, 0.0 /* up is in positive Y direction */ );
  18. jgs Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 18

    // display void myDisplay(void) { glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); // projection glViewport(0, 0, width, height); glMatrixMode(GL_PROJECTION); glLoadIdentity(); //glOrtho(-10, 10, -10, 10, -10, 10); gluPerspective(45, ratio, 1, 1000); // view glMatrixMode(GL_MODELVIEW); glLoadIdentity(); gluLookAt(x, y, z, x + lx, y + ly, z + lz, 0.0f, 1.0f, 0.0f); // draw glColor3f(0.9f, 0.9f, 0.9f); glBegin(GL_QUADS); // vertex glEnd(); // ... glutSwapBuffers(); }
  19. jgs Bonus Display Lists

  20. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 20 jgs

    Creating A Complex Display List // … //create several pyramids GLuint worldDL = glGenLists(1); glNewList(worldDL, GL_COMPILE); for (int i = -3; i < 3; i++) for (int j = -3; j < 3; j++) { glPushMatrix(); glTranslatef(i*10.0, 0, j * 10.0); glCallList(pyramidDL); glPopMatrix(); } glEndList(); // …
  21. Javier Gonzalez-Sanchez | SER332 | Spring 2018 | 21 jgs

    Reading 3D geometric transformation & viewing: § (Required) Read Hearn Baker ch5 p261-p277, p283 – p291 § (Required) Read Hearn Baker ch7 p344-p398, focus on perspective projection (pp 368-383), and 3D viewing in OpenGL (pp 383-389) Z-buffer: § Red Book (pdf): ch10, focus on depth buffer related content § Hearn Baker ch9 p531-p534 Front / Back face culling: § Red Book (pdf): ch2 p43-p44
  22. jgs SER332 Introduction to Graphics Javier Gonzalez-Sanchez javiergs@asu.edu Spring 2018

    Disclaimer. These slides can only be used as study material for the class SER332 at ASU. They cannot be distributed or used for another purpose.