1. CSE 470: Computer Graphics

2. 10/15/2015 2 Defining a Vertex A 2D vertex: glVertex2f(GLfloat x, GLfloat y); 2D vertexfloating pointopenGL parameter type (like floating point) A 3D vertex: glVertex3f(GLfloat x, GLfloat y, GLfloat z); Example: A 3D vertex using integer values: glVertex3i(4, 5, 2);

3. 10/15/2015 3 Connecting the Dots glBegin(GL_LINES); GL_LINES connects pairs of points. (x1, y1) (x2, y2) (x3, y3) (x4, y4) glVertex2f(x1, y1); glVertex2f(x2, y2); glVertex2f(x3, y3); glVertex2f(x4, y4); glEnd();

4. 10/15/2015 4 Other Drawing functions GL_LINE_STRIP: Connect each consecutive point with previous one. p1 p2 p3 p4 p5 p6 p1 p2 p3 p4 p1p2 p3p4 GL_LINE_LOOP: Same as line strip, except also connects last point with first point. GL_POLYGON: Vertices define the vertices of a polygon. Polygons have special properties that differ from line loops (e.g. you can fill in a polygon).

5. 10/15/2015 5 Polygons Polygons have an interior that can be filled. Polygons are used in graphics systems to create surfaces. Curved surfaces can be approximated by many small polygons. Polygons can be rendered (drawn on the screen) rapidly. The interior of the polygon must be well defined. It must be: –Simple, convex and flat.

6. 10/15/2015 6 Well behaved polygons Simple polygons: No pair of edges cross. Convex polygons: A line between any two points inside the polygon or on the boundary lies completely within the object Flat polygons: All vertices must lie in the same plane. This is trivial if the polygon is a triangle, but takes some work for polygons with more than 3 sides. Simple Not Simple Convex p1 p2 Not Convex

7. 10/15/2015 7 The Clipping Volume The region of the scene that's imaged is the clipping volume. (Or the clipping rectangle for 2D images). near far left right top bottom Regions outside the clipping volume are not rendered.

8. 10/15/2015 8 Specifying the clipping volume In 3D: void glOrtho(GLdouble left, GLdouble right, GLdouble bottom, GLdouble top, GLdouble near, GLdouble far); In 2D: void glOrtho2D(GLdouble left, GLdouble right, GLdouble bottom, GLdouble top); (glOrtho2D sets near and far to -1.0 and 1.0 respectively)

9. 10/15/2015 9 Orthographic projection Orthographic projection sets all Z values to zero. Point P = (X, Y, Z), will project to image point p = (x, y) where x = X and y = Y Y Z P = (Xp, Yp, Zp) Yp

10. 10/15/2015 10 View Ports Clipping window is defined in world coordinates. OpenGL renders the image in screen coordinates. OpenGL must translate the image from world coordinates to the screen pixel coordinates. The drawing region on the screen is called the viewport.

11. 10/15/2015 11 Defining a viewport void glViewPort(GLint x, GLint y, GLsizei w, GLsizei h); (x, y) w h Lower left-hand corner

12. 10/15/2015 12 Mapping from world to screen Want entire image from the clipping region to be mapped onto the entire viewport. Therefore, you need to make the height/width (aspect ratio) the same for both (or you will get a distorted image). ClippingViewPort hchc wcwc wvwv hvhv

13. 10/15/2015 13 Callback functions glut handles specific events using callback functions. Program specifies which function should be called for a given event. When a particular event occurs, the specified function is called to handle the event. The display() function is a callback function. We will create callback functions for menus, mouse clicks, etc.

14. 10/15/2015 14 OpenGL Functions glutDisplayFunc() – an event callback function. Whenever GLUT determines that the contents of the window need to be redisplayed, the callback function registered by glutDisplayFunc() is executed. You should put all routines need to redraw in the display callback function. glutReshapeFunc() – indicates what action should be taken when the window is resized. The glutReshapeFunc() is a callback function that specifies the function that is called whenever the window is resized or moved. Typically, the function that is called when needed by the reshape function displays the window to the new size and redefines the viewing characteristics as desired. If glutReshapeFunc() is not called, a default reshape function is called which sets the view to minimize distortion and sets the display to the new height and width.

15. 10/15/2015 15 Orthographic: Orthographic projection maps objects directly onto the screen without affecting their relative sizes. This projection is used mainly in architectural and computer-aided design applications, where the actual measurements of the objects are more important than how they might look. The command glFrustum() is used to set the projection transformation. The command glMatrixMode() is used, with the argument GL_PROJECTION is used to indicate that the current matrix specifies the projection transformation and that subsequent transformation calls affect the projection matrix. Note that we use the glLoadIdentity() command to initialize the current projection matrix so that only the specified projection transformation(s) have an effect. Finally, we calle the command glOrtho() to create an orthographic parallel viewing volume. The viewing volume is a box with the left, right, top, bottom, near and far edges specified in the glOrtho() command.glFrustum()glMatrixMode()glLoadIdentity()glOrtho() When it is time to perform transformations on the models that we have created, we will use the same glMatrixMode() command with GL_MODELVIEW as the argument. This indicates that the succeeding transformations now affect the modelview matrix instead of the projection matrix.glMatrixMode() Orthographic

16. 10/15/2015 16 glPushMatrix() – save the current transformation state by copying the matrix on the top of the matrix stack which was last referenced by the glMatrixMode() command. This top matrix can then be translated and drawn, as desires, and ultimately destroyed using the glPopMatrix() command. This leaves you right where you were before and ready to repeat the process for the next version of the object. glPopMatrix() -- restore to previous transformation state. Matrix Stack

17. 10/15/2015 17 Animation glutIdleFunc() – The Idle Callback specifies a function that is involked whenever the system is not handling any other callbacks or events. glutSwapBuffers() – double-buffering - hardware or software that supplies two complete color buffers. One is displayed while the other is being drawn. When the drawing of a frame is complete, the two buffers are swapped, so the one that was being viewed is now used for drawing, and vice versa. With double-buffering, every frame is shown only when the drawing is complete; the viewer will never see a partially drawn frame glutPostRedisplay() -- This will cause the display function to be involked again with the new variable.

18. 10/15/2015 18 Display List A display list is a group of OpenGL commands only that have been stored for later execution. glNewList() -- specifies the start of a display list. The first parameter is a nonzero positive integer that uniquely identifies the display list created by glGenLists(). Two parameters can be put, GL_COMPILE_AND_EXECUTE and GL_COMPILE. glEndList() -- specifies the end of a display list. glCallList() – executes a display list.

19. 10/15/2015 19 Thank You

20. 10/15/2015 20

21. 10/15/2015 21

22. 10/15/2015 22

23. 10/15/2015 23 Algorithm: Voronoi Hierarchy Construction 1. in 2D planar case 2. in 3D space case