CSE 470: Computer Graphics

04/19/23 2

Defining a Vertex

A 2D vertex:

glVertex2f(GLfloat x, GLfloat y);

2D vertex floating point openGL 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);

04/19/23 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();

04/19/23 4

Other Drawing functions

GL_LINE_STRIP: Connect each consecutive point with previous one. p1 p2

p3

p4

p5

p6

p1 p2p3

p4

p1 p2

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

04/19/23 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.

04/19/23 6

Well behaved polygonsSimple 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

p1p1

p2p2

Not Convex

04/19/23 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 righttop

bottom

Regions outside the clipping volume are not rendered.

04/19/23 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)

04/19/23 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

04/19/23 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.

04/19/23 11

Defining a viewport

void glViewPort(GLint x, GLint y, GLsizei w, GLsizei h);

(x, y)

w

h

Lower left-hand corner

04/19/23 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).

Clipping ViewPort

hc

wc

wv

hv

04/19/23 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.

04/19/23 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.

04/19/23 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.

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.

Orthographic

04/19/23 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

04/19/23 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.

04/19/23 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.

04/19/23 19

Thank You

04/19/23 20

04/19/23 21

04/19/23 22

04/19/23 23

Algorithm: Voronoi Hierarchy Construction

1. in 2D planar case

2. in 3D space case