1 / 47

Computer Graphics CSCE 441: Learn 2D and 3D Graphics

Join this class to explore the world of computer graphics, covering topics like 2D graphics, fractals, 3D graphics, ray tracing, and more.

aaronbenson
Download Presentation

Computer Graphics CSCE 441: Learn 2D and 3D Graphics

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Computer Graphics CSCE 441 Dr. Scott Schaefer

  2. Staff • Instructor • Dr. Scott Schaefer • HRBB 527B • Office Hours: 9:00am-10:00am T/R (or by appointment) • TA • Hang Li • ETB 2016 • Office Hours: 1:30pm-3:30pm M/T/R

  3. Websites • Course Page http://courses.cs.tamu.edu/schaefer/441_Fall2017 • Piazza Discussion Board http://piazza.com/tamu/fall2017/csce441/home

  4. Why did you take this class?

  5. Games

  6. Movies

  7. Visualization

  8. Industrial Design

  9. What will you learn in this class? • 2D Graphics • Drawing lines, polygons • Fractals • 3D Graphics • Transformations • Lighting • Ray Tracing • Solid Modeling • Splines/Subdivision

  10. What you’re expected to know • Programming Experience • Assignments in C/C++ • Simple Mathematics Graphics is mathematics made visible

  11. How much math? • General geometry/linear algebra • Matrices • Multiplication, inversion, determinant • Vectors • Dot product, cross product, linear independence

  12. First Homework Assignment! • Linear Algebra Test http://projects.cs.tamu.edu/keyser/LAtest/ • Complete before September 8, 2017 • Take as many times as you like • Must get at least 90% correct Grade = ActualGrade * (exam 90% ? 1 : 0 )

  13. Other Assignments • Simple Painting Program • Polygon Drawing • Fractals and Iterated Affine Transformations • 3D Rasterization and Hidden Surfaces • Ray Tracing

  14. More on Assignments • Turn in code via CSNET (get an account if you don’t already have one) • Due by 11:59pm on day specified • Code, solution file, proj file and Win32 executable • Make your code readable (comment) • You may discuss concepts, but coding is individual (no “team coding” or web)

  15. Grading • 60% Assignments • 15% Midterm • 25% Final

  16. Late Policy • Penalty = m: number of minutes late percentage penalty days late

  17. Textbooks

  18. Suggested Reading

  19. Introduction to OpenGL • What is OpenGL? Computer-graphics API (application programming interface) • Developed by SGI in 1992 • Efficient, streaming interface • 250+ function calls for drawing 2D and 3D graphics • Hardware independent • Operating system independent • Direct3D alternative API from Microsoft

  20. Introduction to OpenGL • What OpenGL is NOT • No commands for windowing • No commands for obtaining user input • No commands for anything except drawing on the screen

  21. A Smidgen of OpenGL Code # include <whateverYouNeed.h> Main() { IntializeAWindowPlease(); glClearColor (0.0, 0.0, 0.0, 0.0); glClear (GL_COLOR_BUFFER_BIT); glColor3f ( 1.0, 1.0, 1.0); glOrtho (0.0, 1.0, 0.0, 1.0, -1.0, 1.0); glBegin (GL_POLYGON); glVertex3f (0.25, 0.25, 0.0); glVertex3f (0.75, 0.25, 0.0); glVertex3f (0.75, 0.75, 0.0); glVertex3f (0.25, 0.75, 0.0); glEnd(); glFlush(); UpdateTheWindowAndCheckForEvents(); }

  22. A Smidgen of OpenGL Code Sets the color for clearing the screen # include <whateverYouNeed.h> Main() { IntializeAWindowPlease(); glClearColor (0.0, 0.0, 0.0, 0.0); glClear (GL_COLOR_BUFFER_BIT); glColor3f ( 1.0, 1.0, 1.0); glOrtho (0.0, 1.0, 0.0, 1.0, -1.0, 1.0); glBegin (GL_POLYGON); glVertex3f (0.25, 0.25, 0.0); glVertex3f (0.75, 0.25, 0.0); glVertex3f (0.75, 0.75, 0.0); glVertex3f (0.25, 0.75, 0.0); glEnd(); glFlush(); UpdateTheWindowAndCheckForEvents(); }

  23. A Smidgen of OpenGL Code Clears the screen # include <whateverYouNeed.h> Main() { IntializeAWindowPlease(); glClearColor (0.0, 0.0, 0.0, 0.0); glClear (GL_COLOR_BUFFER_BIT); glColor3f ( 1.0, 1.0, 1.0); glOrtho (0.0, 1.0, 0.0, 1.0, -1.0, 1.0); glBegin (GL_POLYGON); glVertex3f (0.25, 0.25, 0.0); glVertex3f (0.75, 0.25, 0.0); glVertex3f (0.75, 0.75, 0.0); glVertex3f (0.25, 0.75, 0.0); glEnd(); glFlush(); UpdateTheWindowAndCheckForEvents(); }

  24. A Smidgen of OpenGL Code Sets the current drawing color to white # include <whateverYouNeed.h> Main() { IntializeAWindowPlease(); glClearColor (0.0, 0.0, 0.0, 0.0); glClear (GL_COLOR_BUFFER_BIT); glColor3f ( 1.0, 1.0, 1.0); glOrtho (0.0, 1.0, 0.0, 1.0, -1.0, 1.0); glBegin (GL_POLYGON); glVertex3f (0.25, 0.25, 0.0); glVertex3f (0.75, 0.25, 0.0); glVertex3f (0.75, 0.75, 0.0); glVertex3f (0.25, 0.75, 0.0); glEnd(); glFlush(); UpdateTheWindowAndCheckForEvents(); }

  25. A Smidgen of OpenGL Code Sets the window coordinates to (0,0,-1) – (1,1,1) # include <whateverYouNeed.h> Main() { IntializeAWindowPlease(); glClearColor (0.0, 0.0, 0.0, 0.0); glClear (GL_COLOR_BUFFER_BIT); glColor3f ( 1.0, 1.0, 1.0); glOrtho (0.0, 1.0, 0.0, 1.0, -1.0, 1.0); glBegin (GL_POLYGON); glVertex3f (0.25, 0.25, 0.0); glVertex3f (0.75, 0.25, 0.0); glVertex3f (0.75, 0.75, 0.0); glVertex3f (0.25, 0.75, 0.0); glEnd(); glFlush(); UpdateTheWindowAndCheckForEvents(); }

  26. A Smidgen of OpenGL Code # include <whateverYouNeed.h> Main() { IntializeAWindowPlease(); glClearColor (0.0, 0.0, 0.0, 0.0); glClear (GL_COLOR_BUFFER_BIT); glColor3f ( 1.0, 1.0, 1.0); glOrtho (0.0, 1.0, 0.0, 1.0, -1.0, 1.0); glBegin (GL_POLYGON); glVertex3f (0.25, 0.25, 0.0); glVertex3f (0.75, 0.25, 0.0); glVertex3f (0.75, 0.75, 0.0); glVertex3f (0.25, 0.75, 0.0); glEnd(); glFlush(); UpdateTheWindowAndCheckForEvents(); } Starts drawing a polygon

  27. A Smidgen of OpenGL Code # include <whateverYouNeed.h> Main() { IntializeAWindowPlease(); glClearColor (0.0, 0.0, 0.0, 0.0); glClear (GL_COLOR_BUFFER_BIT); glColor3f ( 1.0, 1.0, 1.0); glOrtho (0.0, 1.0, 0.0, 1.0, -1.0, 1.0); glBegin (GL_POLYGON); glVertex3f (0.25, 0.25, 0.0); glVertex3f (0.75, 0.25, 0.0); glVertex3f (0.75, 0.75, 0.0); glVertex3f (0.25, 0.75, 0.0); glEnd(); glFlush(); UpdateTheWindowAndCheckForEvents(); } Specifies the vertices of the polygon

  28. A Smidgen of OpenGL Code # include <whateverYouNeed.h> Main() { IntializeAWindowPlease(); glClearColor (0.0, 0.0, 0.0, 0.0); glClear (GL_COLOR_BUFFER_BIT); glColor3f ( 1.0, 1.0, 1.0); glOrtho (0.0, 1.0, 0.0, 1.0, -1.0, 1.0); glBegin (GL_POLYGON); glVertex3f (0.25, 0.25, 0.0); glVertex3f (0.75, 0.25, 0.0); glVertex3f (0.75, 0.75, 0.0); glVertex3f (0.25, 0.75, 0.0); glEnd(); glFlush(); UpdateTheWindowAndCheckForEvents(); } Ends the polygon

  29. A Smidgen of OpenGL Code # include <whateverYouNeed.h> Main() { IntializeAWindowPlease(); glClearColor (0.0, 0.0, 0.0, 0.0); glClear (GL_COLOR_BUFFER_BIT); glColor3f ( 1.0, 1.0, 1.0); glOrtho (0.0, 1.0, 0.0, 1.0, -1.0, 1.0); glBegin (GL_POLYGON); glVertex3f (0.25, 0.25, 0.0); glVertex3f (0.75, 0.25, 0.0); glVertex3f (0.75, 0.75, 0.0); glVertex3f (0.25, 0.75, 0.0); glEnd(); glFlush(); UpdateTheWindowAndCheckForEvents(); } Flushes all commands to ensure polygon is drawn

  30. OpenGL Command Formats glVertex3fv( v ) Prefix Initial capital letters Data Type Vector Number of components b - byte ub - unsigned byte s - short us - unsigned short i - int ui - unsigned int f - float d - double omit “v” for scalar form glVertex2f( x, y ) 2 - (x,y) 3 - (x,y,z) 4 - (x,y,z,w)

  31. GL_LINES GL_POLYGON GL_LINE_STRIP GL_LINE_LOOP GL_POINTS GL_TRIANGLES GL_QUADS GL_TRIANGLE_FAN GL_TRIANGLE_STRIP GL_QUAD_STRIP OpenGL Geometric Primitives • All geometric primitives are specified by vertices

  32. OpenGL Drawing Functions glBegin (GL_POINTS); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p3); glVertex2iv (p4); glVertex2iv (p5); glVertex2iv (p6); glEnd(); P6 P5 P1 P4 P2 P3

  33. OpenGL Drawing Functions glBegin (GL_LINES); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p3); glVertex2iv (p4); glVertex2iv (p5); glVertex2iv (p6); glEnd(); P6 P5 P1 P4 P2 P3

  34. OpenGL Drawing Functions glBegin (GL_LINE_STRIP); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p3); glVertex2iv (p4); glVertex2iv (p5); glVertex2iv (p6); glEnd(); P6 P5 P1 P4 P2 P3

  35. OpenGL Drawing Functions glBegin (GL_LINE_LOOP); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p3); glVertex2iv (p4); glVertex2iv (p5); glVertex2iv (p6); glEnd(); P6 P5 P1 P4 P2 P3

  36. OpenGL Drawing Functions glBegin (GL_POLYGON); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p3); glVertex2iv (p4); glVertex2iv (p5); glVertex2iv (p6); glEnd(); P6 P5 P1 P4 P2 P3

  37. OpenGL Drawing Functions glBegin (GL_TRIANGLES); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p6); glVertex2iv (p3); glVertex2iv (p4); glVertex2iv (p5); glEnd(); P6 P5 P1 P4 P2 P3

  38. OpenGL Drawing Functions glBegin (GL_TRIANGLES_STRIP); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p6); glVertex2iv (p3); glVertex2iv (p5); glVertex2iv (p4); glEnd(); P6 P5 P1 P4 P2 P3

  39. OpenGL Drawing Functions glBegin (GL_TRIANGLES_FAN); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p3); glVertex2iv (p4); glVertex2iv (p5); glVertex2iv (p6); glEnd(); P6 P5 P1 P4 P2 P3

  40. OpenGL Drawing Functions glBegin (GL_QUADS); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p3); glVertex2iv (p4); glVertex2iv (p5); glVertex2iv (p6); glVertex2iv (p7); glVertex2iv (p8); glEnd(); P8 P1 P4 P5 P2 P6 P3 P7

  41. OpenGL Drawing Functions glBegin (GL_QUADS_STRIP); glVertex2iv (p1); glVertex2iv (p2); glVertex2iv (p4); glVertex2iv (p3); glVertex2iv (p5); glVertex2iv (p6); glVertex2iv (p8); glVertex2iv (p7); glEnd(); P8 P1 P4 P5 P2 P6 P3 P7

  42. OpenGL-Related Libraries • GLU (OpenGL Utility Library) • - Part of OpenGL • - Provides higher-level drawing routines such as • Spheres, NURBS, tessellators, quadric shapes, etc…

  43. OpenGL-Related Libraries • GLU (OpenGL Utility Library) • - Part of OpenGL • - Provides higher-level drawing routines such as • Spheres, NURBS, tessellators, quadric shapes, etc… • GLUT (OpenGL Utility Toolkit) - perform system-level I/O with the host operating system - cross platform • - portable windowing API • - not officially part of OpenGL

  44. GLUT: OpenGLUtility Toolkit • Application Structure • Configure and open window • Initialize OpenGL state • Register input callback functions • render • resize • input: keyboard, mouse, etc. • Enter event processing loop

  45. Sample Program void main( int argc, char* argv[]) { glutInit (&argc, argv); glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB ); glutInitWindowSize (250, 250); glutInitWindowPosition (100, 100); glutCreateWindow ( "HELLO"); init(); glutDisplayFunc ( display ); glutMainLoop(); } /* OpenGL Initialization */ /* callback function */

  46. GLUT Callback Functions • Routine to call when something happens • window resized, user input, window needs drawing, etc… • “Register” callbacks with GLUT glutDisplayFunc( display ); glutIdleFunc( idle ); glutKeyboardFunc( keyboard ); glutMouseFunc( mouse );

  47. Assignment 1 – Simple OpenGL/GLUT Application • Build a simple OpenGL/GLUT application • Designed to get you started using OpenGL and callbacks for interaction • Full description available on course webpage http://courses.cs.tamu.edu/schaefer/441_Fall2017

More Related