# Computer Graphics CSCE 441

## Presentation on theme: "Computer Graphics CSCE 441"— Presentation transcript:

Computer Graphics CSCE 441
Dr. Scott Schaefer

Staff Instructor Dr. Scott Schaefer HRBB 527B
Office Hours: MW 10:00am – 11:00am (or by appointment) TA Lei He ETB 2016 (knock on door) Office Hours: R 10:00am – noon F 1pm-3pm

Websites Course Page Piazza Discussion Board
Piazza Discussion Board

Why did you take this class?

Games

Movies

Visualization

Industrial Design

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

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

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

First Homework Assignment!
Linear Algebra Test Complete before January 27, 2014 Take as many times as you like Must get at least 90% correct Grade = ActualGrade * (exam 90% ? 1 : 0 )

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

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)

Grading 60% Assignments 15% Midterm 25% Final

Late Policy Penalty = m: number of minutes late percentage penalty
100 80 60 percentage penalty 40 20 1 2 3 4 days late

Textbooks

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

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

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(); } GL_COLOR_BUFFER_BIT is an OpenGL symbolic constant specifying that it is the bit values in the color buffer that are to be set to the value indicated in the glClearColor function.

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(); } GL_COLOR_BUFFER_BIT is an OpenGL symbolic constant specifying that it is the bit values in the color buffer that are to be set to the value indicated in the glClearColor function.

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(); } Clears the screen GL_COLOR_BUFFER_BIT is an OpenGL symbolic constant specifying that it is the bit values in the color buffer that are to be set to the value indicated in the glClearColor function.

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(); } Sets the current drawing color to white GL_COLOR_BUFFER_BIT is an OpenGL symbolic constant specifying that it is the bit values in the color buffer that are to be set to the value indicated in the glClearColor function.

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(); } Sets the window coordinates to (0,0,-1) – (1,1,1) GL_COLOR_BUFFER_BIT is an OpenGL symbolic constant specifying that it is the bit values in the color buffer that are to be set to the value indicated in the glClearColor function.

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(); } GL_COLOR_BUFFER_BIT is an OpenGL symbolic constant specifying that it is the bit values in the color buffer that are to be set to the value indicated in the glClearColor function. Starts drawing a polygon

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(); } GL_COLOR_BUFFER_BIT is an OpenGL symbolic constant specifying that it is the bit values in the color buffer that are to be set to the value indicated in the glClearColor function. Specifies the vertices of the polygon

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(); } GL_COLOR_BUFFER_BIT is an OpenGL symbolic constant specifying that it is the bit values in the color buffer that are to be set to the value indicated in the glClearColor function. Ends the polygon

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(); } GL_COLOR_BUFFER_BIT is an OpenGL symbolic constant specifying that it is the bit values in the color buffer that are to be set to the value indicated in the glClearColor function. Flushes all commands to ensure polygon is drawn

OpenGL Command Formats
glVertex3fv( v ) Prefix Initial capital letters Number of components Data Type Vector 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)

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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 */

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

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