Computer Graphics (Basic OpenGL) Thilo Kielmann Fall 2008 Vrije Universiteit, Amsterdam kielmann@cs.vu.nl http://www.cs.vu.nl/˜graphics/ Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 1 Outline for today • Vertices ⇒ Vertices • Control and the window system • Basic elements (color, polygons, text) • Image formation • Viewing API’s
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 2 OpenGL’s “Atoms”: Vertices • a point is called a vertex glVertex3fv ( v ) ⋆ user coordinates: possibly infinite drawing pad • vertices (plural of vertex) are always 3D Number of components Data Type Vector ⋆ can also be used as 2D omit "v" for 2 (x,y) b byte scalar form 3 (x,y,z) ub unsigned byte • general form: glVertex* examples: 4 (x,y,z,w) s short glVertex2( x,y ) us unsigned short i int ⋆ glVertex2i(GLint x, GLint y) ui unsigned int f float ⋆ glVertex3f(GLfloat x, GLfloat y, GLfloat z) d double ⋆ glVertex3fv(GLfloat[] vertex) All OpenGL calls follow this general structure. Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 3 Vertices are used to build other primitives glBegin(GL POINTS); glBegin(GL LINES); glVertex2f(x1,y1); glVertex2f(x1,y1); glVertex2f(x2,y2); glVertex2f(x2,y2); glEnd(); glEnd();
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 4 Example: The Sierpinksi Gasket given v 1 , v 2 , and v 3 pick p 0 at random pick one of v 1 , v 2 , v 3 at random p 1 = ”halfway”between p 0 and vertex display p 1 replace p 0 by p 1 and continue Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 5 Plotting Sierpinski Points void display( void ){ typedef GLfloat point2[2]; point2 vertices[3]={{0.0,0.0},{250.0,500.0},{500.0,0.0}}; point2 p ={75.0,50.0}; /* initial point inside triangle */ int j, k, rand(); for ( k=0; k<5000; k++) { j=rand() %3; /* pick a vertex at random */ p[0] = (p[0]+vertices[j][0])/2.0; p[1] = (p[1]+vertices[j][1])/2.0; glBegin(GL_POINTS); glVertex2fv(p); glEnd(); } glFlush(); /* clear buffers */ }
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 6 Still Open Questions: 1. In what colors are we drawing? 2. Where on the screen does our image appear? 3. How large will the image be? 4. How do we create a window for the image? 5. Objects at which coordinates will appear on the screen? 6. How long will the image remain on the screen? Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 7 Answering these Questions: Categories of Graphics Functions 1. primitive functions (objects: “what”) 2. attribute functions (“how”) 3. viewing functions (camera) 4. transformation functions (e.g., rotation . . . ) 5. input functions 6. control functions
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 8 Outline for today • Vertices • Control and the window system ⇒ Control and the window system • Basic elements (color, polygons, text) • Image formation • Viewing API’s Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 9 OpenGL Library Structure or: #include <GL/glut.h> #include <glut.h> glFunction() gluFunction() glutFunction()
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 10 OpenGL Library Structure (Unix vs. Windows) Only use GL , GLU , and GLUT calls for portable programs! (Check the documentation for our own header file.) Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 11 Control and the Window System = ⇒ GLUT #include <GL/glut.h> int main(int argc, char** argv){ glutInit(&argc,argv); glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB); glutInitWindowSize(500,500); glutInitWindowPosition(0,0); glutCreateWindow("Sierpinski Gasket"); glutDisplayFunc(display); /* register display func. */ myinit(); /* application-specific inits */ glutMainLoop(); /* enter event loop */ return 0; }
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 12 myinit() – Application-specific void myinit(void) { glClearColor(1.0, 1.0, 1.0, 1.0); /* white background */ /* ^----- opaque background */ glColor3f(1.0, 0.0, 0.0); /* draw in red */ glMatrixMode(GL_PROJECTION); glLoadIdentity(); gluOrtho2D(0.0, 500.0, 0.0, 500.0); /* ==> orthographic viewing */ glMatrixMode(GL_MODELVIEW); } Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 13 display() – Application-specific void display( void ){ typedef GLfloat point2[2]; point2 vertices[3]={{0.0,0.0},{250.0,500.0},{500.0,0.0}}; point2 p ={75.0,50.0}; /* initial point inside triangle */ int j, k, rand(); for ( k=0; k<5000; k++) { j=rand() %3; /* pick a vertex at random */ p[0] = (p[0]+vertices[j][0])/2.0; p[1] = (p[1]+vertices[j][1])/2.0; glBegin(GL_POINTS); glVertex2fv(p); glEnd(); } glFlush(); /* clear buffers */ }
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 14 BTW: Window Size and Aspect Ratio Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 15 Viewports void glViewport( GLint x, GLint y, GLsizei w, GLsizei h)
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 16 Outline for today • Vertices • Control and the window system ⇒ Basic elements (color, polygons, text) • Basic elements (color, polygons, text) • Image formation • Viewing API’s Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 17 The Graphics State Machine First, attribute functions set how vertices will be displayed. Then, vertices are drawn, according to the current state. (According to all previous calls to the attribute functions.)
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 18 RGB: Additive Color Matching C = T 1 · R + T 2 · G + T 3 · B Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 19 The Color Solid (Color Cube)
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 20 Additive and Subtractive Color RGB CMY (CMYK) Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 21 The Human Visual System All the graphics hardware is used trying to impress the human eye. . .
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 22 BTW: What is Light? The Electromagnetic Spectrum: Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 23 Human (Cone) Observer Curves standard observer curve cone sensitivity curves Color perception is individual, non-linear, non-trivial. . .
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 24 Geometric Primitive Elements glBegin( ... ); glVertex*( ... ); . . glEnd(); Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 25 Polygon Types The appearance of polygons depends on the attributes that have been set before. (This is the same as with lines.)
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 26 Polygon Strips P1 P3 P5 P7 GL_TRIANGLE_STRIP P0 P2 P4 P6 P1 P3 P5 P7 GL_QUAD_STRIP P0 P2 P4 P6 P1 P2 P3 GL_TRIANGLE_FAN P4 P0 Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 27 Polygons can be Filled
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 28 Filling the Polygon Interior (2D) To be filled, polygons have to be: simple and convex . A simple polygon has a Convex polygon: well-defined interior. “All points on the line seg- ment between any 2 points (a) simple inside the polygon are inside the polygon.” (b) non-simple Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 29 Filling Polygons (3D) Polygons have to be simple, convex, and flat . This often boils down to triangles!
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 30 Attributes for Lines and Polygons Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 31 Text (Raster Text)
Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 32 Text (Stroke Text) Computer Graphics Stroke text can be treated like all other graphics objects. Computer Graphics (Basic OpenGL, Input and Interaction), ((57)) � 2000–2008, Thilo Kielmann c 33 Fonts in GLUT Stroke fonts: (have to be scaled) glutStrokeCharacter( GLUT STROKE MONO ROMAN, int k) glutStrokeCharacter( GLUT STROKE ROMAN, int k) Bitmap fonts: glRasterPos2i(rx, ry); glutBitmapCharacter(GLUT BITMAP 8 BY 13, k); rx += glutBitmapWidth(GLUT BITMAP 8 BY 13, k);
Recommend
More recommend
