1. 1 Chapter 2 Graphics Programming

2. 2 Using OpenGL in Visual C++ – 1/3 Opengl32.dll and glu32.dll should be in the system folder Opengl32.lib and glu32.lib should be in the lib folder for VC++ gl.h and glu.h should be in a folder called GL under the include folder for VC++ Get glut32.lib, glut32.dll and glut.h from the course homepage and put them in the same places as the other files

3. 3 Using OpenGL in Visual C++ – 2/3 Fire up visual studio Create a new project as the following: File  New  Project (input your project name, then a directory (workspace) with the same name will be built)  Win32 Console Application  An Empty Application

4. 4 Using OpenGL in Visual C++ – 3/3 In the workspace click on “File View” to access (expand) the source code tree In “Source Files”, add in the source code (*.c files) Select Project  Settings  Link and in “Object/library modules” add “Opengl32.lib glu32.lib glut32.lib” Press “F7” to build “your_project.exe”

5. 5 Sierpinski Gasket – 1/2 1. Pick an initial point at random inside the triangle 2. Select one of the three vertices at random 3. Find the point halfway between the initial point and the randomly selected vertex 4. Display the new point 5. Replace the initial point with this new point 6. Return to step 2

6. 6 Sierpinski Gasket – 2/2 main() { initialize_the_system(); for(some_number_of_points) { pt = generate_a_point(); display_the_point(pt); } cleanup(); }

7. 7 Programming 2D Applications A vertex is a location in space glVertex* * is in the form of nt or ntv n is the number of dimensions t denotes the data type: integer (i), float (f), or double (d); pointer to an array (v) #define GLfloat float

8. 8 Examples glVertex2i(GLint xi, GLint yi) glVertex3f(GLfloat x, GLfloat y, GLfloat z) GLfloat vertex[3] glVertex3fv(vertex)

9. 9 OpenGL Object Examples glBegin(GL_LINES); glVertex2f(x1, y1); glVertex2f(x2, y2); glEnd(); glBegin(GL_POINTS); glVertex2f(x1, y1); glVertex2f(x2, y2); glEnd();

10. 10 Code of Sierpinski Gasket – 1/3 Typedef GLfloat point2[2]; void display(void) { point2 vertices[3]={{0,0},{250,500},{500,0}}; /* an arbitrary triangle */ static point2 p = {75,50}; /* any desired initial point */ int j, k; int rand(); /* standard random-number generator */

11. 11 Code of Sierpinski Gasket – 2/3 for(k=0;k<5000;k++) { j=rand()%3;/* pick a random vertex from 0, 1, 2 */ p[0]=(p[0]+vertices[j][0])/2;/* compute new point */ p[1]=(p[1]+vertices[j][1])/2; glBegin(GL_POINTS); glVertex2fv(p);/* display new point */ glEnd(); } glFlush(); }

12. 12 Code of Sierpinski Gasket – 3/3

13. 13 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 an area of the screen – a window – for our image? 5. How long will the image remain on the screen?

14. 14 Coordinate Systems

15. 15 OpenGL API

16. 16 Graphics Functions – 1/3

17. 17 Graphics Functions – 2/3 Primitive functions: points, line segments, polygons, pixels, text, curves, surfaces Attributes functions: color, pattern, typeface Viewing functions: position, orientation, clipping

18. 18 Graphics Functions – 3/3 Transformation functions: rotation, translation, scaling Input functions: keyboards, mice, data tablets Control functions: communicate with windows, initialization, error handling Inquiry functions: number of colors, camera parameters/values

19. 19 Graphics Pipeline and State Machine Functionalities of graphics functions: Define primitive: glvertex* Change opengl state (most of them!) Present color, current matrix

20. 20 OpenGL Interface GL (OpenGL in Windows) GLU (graphics utility library) uses only GL functions, creates common objects (such as spheres) GLUT (GL Utility Toolkit) interfaces with the window system GLX: glue between OpenGL and Xwindow, used by GLUT

21. 21 OpenGL Library Organization

22. 22 API Dilemma for Primitives Minimal or maximal? Convenience versus portability OpenGL’s intermediate approach: GL contains a small set of basic primitives GLU contains richer set of objects

23. 23 OpenGL Primitives Geometric primitives and raster primitives

24. 24 Points and Line Segments

25. 25 Polygon Basics – 1/3 Filled objectsMethods of displaying a polygon

26. 26 Polygon Basics – 2/3 Simple, convex, and flat Simple Nonsimple

27. 27 Polygon Basics – 3/3 Convexity Convex objects

28. 28 Polygon Types in OpenGL – 1/2 In OpenGL, edges and interior must be drawn separately!

29. 29 Polygon Types in OpenGL – 2/2 Use triangles if possible because of efficiency!

30. 30 Drawing a Sphere – 1/5

31. 31 Drawing a Sphere – 2/5   x y z

32. 32 Drawing a Sphere – 3/5 c=M_PI/180.0; // degrees to radians, M_PI=3.14159… for(phi=-80.0; phi<=80.0; phi+=20.0) { glBegin(GL_QUAD_STRIP); for(theta=-180.0; theta<=180.0; theta+=20.0) { x=sin(c*theta)*cos(c*phi); y=cos(c*theta)*cos(c*phi); z=sin(c*phi); glVertex3d(x, y, z); x=sin(c*theta)*cos(c*(phi+20.0)); y=cos(c*theta)*sin(c*(phi+20.0)); z=sin(c*(phi+20.0)); glVertex3d(x, y, z); } glEnd(); } Drawing the portion of lower latitudes

33. 33 Drawing a Sphere – 4/5 x=y=0; z=1; glBegin(GL_TRIANGLE_FAN); glVertex3d(x, y, z); c=M_PI/180.0; z=sin(c*80.0); for(theta=-180.0; theta<=180.0; theta+=20.0) { x=sin(c*theta)*cos(c*80.0); y=cos(c*theta)*sin(c*80.0); glVertex3d(x, y, z); } glEnd(); Drawing the portion around the north pole

34. 34 Drawing a Sphere – 5/5 x=y=0; z=-1; glBegin(GL_TRIANGLE_FAN); glVertex3d(x, y, z); z=-sin(c*80.0); for(theta=-180.0; theta<=180.0; theta+=20.0) { x=sin(c*theta)*cos(c*80.0); y=cos(c*theta)*sin(c*80.0); glVertex3d(x, y, z); } glEnd(); Drawing the portion around the south pole

35. 35 Text – Stroke or Raster

36. 36 Attributes for Lines, Texts …

37. 37 Color – 1/4 Additive color matching C=T 1 R+T 2 G+T 3 B, T 1, T 2, T 3 are the tristimulus values

38. 38 Color – 2/4 Basic tenet of three-color theory: If two colors produce the same tristimulus values, then they are visually indistinguishable The range of colors that we can produce on a given system is called that system’s color gamut

39. 39 Color – 3/4 Color Solid

40. 40 Color – 4/4 Additive Color Subtractive Color

41. 41 RGB Color glColor3f(1.0, 0.0, 0.0): Can be used to specify 24 bits true colors Alpha channel: Used in OpenGL as an opacity or transparency value glClearColor(1.0, 1.0,1.0,1.0) glPointSize(2.0)

42. 42 Indexed Color Color-lookup table Example: k=m=8: pick 256 out of 16M colors

43. 43 Two-dimensional Viewing Objects before clippingImage after clipping

44. 44 Viewing Volume OpenGL default: 2  2  2 cube

45. 45 Orthographic View void glOrtho(GLdouble left, GLdouble right, …)

46. 46 Matrix Mode There are two matrices in OpenGL: Model-view: defines COP and orientation Projection: defines the projection matrix glMatrixMode(GL_PROJECTION); glLoadIdentity(); gluOrtho2D(0.0, 500.0, 0.0, 500.0); glMatrixMode(GL_MODELVIEW);

47. 47 Control Functions OpenGL assumes origin is bottom left glutInit(int *argcp, char **argv); glutCreateWindow(char *title); glutInitDisplayMode(GLUT_RGB | GLUT_DEPTH | GLUT_DOUBLE); glutInitWindowSize(480,640); glutInitWindowPosition(0,0); OpenGL default: RGB color, no hidden- surface removal, single buffering

48. 48 Aspect Ratio Viewing rectangle glOrtho(…) Display window glutInitWindowSize(…)

49. 49 Viewports void glViewport(GLint x, GLint y, GLsizei w, GLsizei h) Viewport is part of the state.

50. 50 main, display, myinit functions … void glutMainLoop(void) Why do we need this? void glutDisplayFunc(void (*func)(void)) When is the function invoked?

51. 51 Sample main program Void main(int argc, char **argv) { glutInit(&argc,argv); glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB); glutInitWindowSize(500, 500); glutInitWindowPosition(0, 0); glutCreateWindow(“Simple OpenGL example”); glutDisplayFunc(display); myinit(); glutMainLoop(); } For most non-interactive applications…

52. 52 Gasket Program – 1/3 void myinit(void) { /* attributes */ glClearColor(1.0, 1.0, 1.0, 1.0); /* white background */ glColor3f(1.0, 0.0, 0.0); /* draw in red */ /* set up viewing */ glMatrixMode(GL_PROJECTION); glLoadIdentity(); gluOrtho2D(0.0, 500.0, 0.0, 500.0); glMatrixMode(GL_MODELVIEW); }

53. 53 Gasket Program – 2/3 void display(void) { typedef GLfloat point2[2]; /* define a point data type */ point2 vertices[3]={{0.0,0.0},{250.0,500.0},{500.0,0.0}} /* triangle */ int i, j, k; int rand(); point2 p={75.0, 50.0}; /* arbitrary point inside triangle */ glClear(GL_COLOR_BUFFER_BIT); /* clear the window */

54. 54 Gasket Program – 3/3 /* compute and output 5000 new points */ for(k=0; k<5000; k++) { j=rand()%3; /* compute point halfway between vertex and old point */ p[0]=(p[0]+vertex[j][0])/2.0; p[1]=(p[1]+vertex[j][1])/2.0; glBegin(GL_POINTS); /* plot point */ glVertex2fv(p); glEnd(); } glFlush(); }

55. 55 Using Recursion – 1/3 void triangle(point2 a, point2 b, point2 c) { glBegin(GL_TRIANGLES); glVertex2fv(a); glVertex2fv(b); glVertex2fv(c); glEnd(); }

56. 56 Using Recursion – 2/3 void divide_triangle(point2 a, point2 b, point2 c, int k) { point2 ab, ac, bc; int j; if(k>0) { for(j=0; j<2; j++) ab[j]=(a[j]+b[j])/2; for(j=0; j<2; j++) ac[j]=(a[j]+c[j])/2; for(j=0; j<2; j++) bc[j]=(b[j]+c[j])/2; divide_triangle(a, ab, ac, k-1); divide_triangle(c, ac, bc, k-1); divide_triangle(b, bc, ab, k-1); } else triangle(a, b, c); /* draw triangle at end of of recursion */ } a bc ab ac bc

57. 57 Using Recursion – 3/3 Void display(void) { glClear(GL_COLOR_BUFFER_BIT); divide_triangle(v[0], v[1], v[2], n); glFlush(); }

58. 58 Three-Dimensional Gasket – 1/2 typedef Glfloat point3[3]; point3 vertices[4] = {{0,0,0,0},{250,500,100},{500,250,250},{250,100,250}}; Point3 new,old={250, 100, 250}; j=rand()%4; new[0]=(old[0]+vertices[j][0])/2; new[1]=(old[1]+vertices[j][1])/2; new[2]=(old[2]+vertices[j][2])/2; tetrahedron

59. 59 Three-Dimensional Gasket – 2/2 /* plot point */ glBegin(GL_POINTS); glVertex3fv(new); glEnd(); /* replace old point by new */ old[0]=new[0]; old[1]=new[1]; old[2]=new[2];

60. 60 3D Recursive Gasket – 1/3 void triangle(point3 a, point3 b, point3 c) { glBegin(GL_POLYGON); glVertex3fv(a); glVertex3fv(b); glVertex3fv(c); glEnd(); }

61. 61 3D Recursive Gasket – 2/3 void divide_triangle(point3 a, point3 b, point3 c, int k) { point3 ab, ac, bc; int j; if(k>0) { for(j=0; j<3; j++) ab[j]=(a[j]+b[j])/2; for(j=0; j<3; j++) ac[j]=(a[j]+c[j])/2; for(j=0; j<3; j++) bc[j]=(b[j]+c[j])/2; divide_triangle(a, ab, ac, k-1); divide_triangle(c, ac, bc, k-1); divide_triangle(b, ab, ab, k-1); } else triangle(a, b, c); /* draw triangle at end of recursion*/ }

62. 62 3D Recursive Gasket – 3/3 void tetrahedron(int n) { glColor3f(1.0, 0.0, 0.0); divide_triangle(v[0], v[1], v[2], k); glColor3f(0.0, 1.0, 0.0); divide_triangle(v[3], v[2], v[1], k); glColor3f(0.0, 0.0, 1.0); divide_triangle(v[0], v[3], v[1], k); glColor3f(0.0, 0.0, 0.0); divide_triangle(v[0], v[2], v[3], k); }

63. 63 Hidden-Surface Removal – 1/3

64. 64 Hidden-Surface Removal – 2/3 Z-Buffer glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH); glEnable(GL_DEPTH_TEST) glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

65. 65 Hidden-Surface Removal – 3/3 void display() { glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); tetrahedron(n); glFlush(); }

66. 66 Summary and Notes Coding OpenGL in Visual C++ OpenGL API Graphics (primitives, attributes), viewing, control, communications with windows … Sample codes