OpenGL Basics

OpenGL &
Computer Graphics Basic

http://www.learncax.com/

Centre for Computational Technologies
CCTech Recruitment Brochure Simulation is The Future!

Outline
1. Introduction to Computer Graphics
2. Computer Graphics Applications
3. A Graphics Pipeline
4. The OpenGL API
5. Primitives: vertices, lines, polygons
6. Attributes: color
7. Example: drawing a shaded triangle

OpenGL Simulation is The Future!

Textbook

OpenGL Programming
Guide, Fourth Edition: The
Official Guide to Learning
OpenGL, Version 1.5, by Woo
et al., Addison Wesley, ISBN:
0201604582.


Basic goal
• Teach you the fundamentals for writing your own
graphics applications


Evolution


PC Architecture


Programming Graphics Applications
• The application is programmed to the 3D graphics API and
links with the driver at runtime


The Graphics Pipeline


 SolidWorks:
 define software behavior
 user input events
 Software logic
 CAD operations



 SolidWorks:
 send OpenGL commands

 OpenGL driver:
 process GL command stream
 talk to GPU


Rasterization vs. Ray Tracing


Rasterization vs. Ray Tracing
• Rasterization:
• for each object ...
– for each pixel ...

• Ray tracing:
• for each pixel ...
– for each object ...


Computer Graphics Applications
• Computer Aided Design
• Computer Aided Manufacturing
• Architecture
• Simulation
• Virtual Reality
• Visualization
• Games
• Movies 
• Medical Imaging


Computer Aided Design (CAD)


Movies


Games


Visualization


Virtual and Augmented Reality


Mobile Media


New Information Spaces


Programming a Pipeline

• Specify the operation of each box
• Replace or accumulate
• State and lack of modularity
• Immediate mode graphics
– On-line (OpenGL)
• Modeling-rendering pipeline
– Off-line (Pixar’s Renderman)


Vertex

• Vertices in world coordinates
• void glVertex3f(GLfloat x, GLfloat y, GLfloat z)
– Vertex (x, y, z) sent down the pipeline
– Function call returns
• Use GLtype for portability and consistency
– glVertex{234}{sfid}[v](TYPE coords)


Transformer

• Transformer in world coordinates
• Must be set before object is drawn!
– glRotatef(45.0, 0.0, 0.0, -1.0);
– glVertex2f(1.0, 0.0);


Clipper

• Mostly automatic from viewport


Projector

Orthographic Perspective


Rasterizer

• Interesting algorithms
• To window coordinates


The OpenGL Vertex Pipeline


OpenGL shaded-quad code
glClearColor(1, 1, 1, 1); // white
glClear(GL_COLOR_BUFFER_BIT);
glLoadIdentity();
glOrtho(0, 100, 0, 100, -1, 1);
glBegin(GL_TRIANGLE_STRIP);
glColor3f(0, 0.5, 0); // dark green
glVertex2i(11, 31);
glVertex2i(37, 71);
glColor3f(0.5, 0, 0); // dark red
glVertex2i(91, 38);
glVertex2i(65, 71);
glEnd();
glFlush();

OpenGL vertex pipeline
Application
Emphasis is on data types
Diagram ignores Vertex assembly
– Pixel pipeline
– Texture memory Vertex operations
– Display lists
Primitive assembly
– …
Display is not part of OpenGL Primitive operations

Rasterization

Fragment operations

Framebuffer

Display

Vertex assembly (data types)
Application
struct {
Vertex assembly
float x,y,z,w;
float r,g,b,a;
Vertex operations
} vertex;
Primitive assembly

Primitive operations

Rasterization

Fragment operations

Framebuffer

Display

Vertex assembly (OpenGL)
Vertex assembly Application
– Force input to canonical format
• Convert to internal representation Vertex assembly
– E.g., x, y to float
• Initialize unspecified values
Vertex operations
– E.g., z = 0, w=1
• Insert current modal state
– E.g., color to 0,0.5,0,1 Primitive assembly
– Or create using evaluators
Error detection Primitive operations
– INVALID_ENUM
– INVALID_VALUE Rasterization
– INVALID_OPERATION
• Especially between Begin and End
Fragment operations

Framebuffer

Display

Vertex assembly (in our case)
glColor3f(0, 0.5, 0); Application
glVertex2i(11, 31);
glVertex2i(37, 71); Vertex assembly
glColor3f(0.5, 0, 0); // no effect
Vertex operations

Primitive assembly

struct { Primitive operations
float x,y,z,w; // 11, 31, 0, 1
float r,g,b,a; // 0, 0.5, 0, 1 Rasterization
} vertex;
Fragment operations
struct {
float x,y,z,w; // 37, 71, 0, 1
Framebuffer
float r,g,b,a; // 0, 0.5, 0, 1
} vertex;
Display

Vertex operations
Application
OpenGL
– Transform coordinates Vertex assembly
• 4x4 matrix arithmetic
– Compute (vertex) lighting Vertex operations
– Compute texture coordinates
Primitive assembly
– …
In our case: Primitive operations
– Scale (arbitrary 100x100) coordinates to fit
window Rasterization
– No lighting, no texture coordinates
Fragment operations

Framebuffer

Display

Primitive assembly (data types)
Application
struct {
Vertex assembly
float x,y,z,w;
float r,g,b,a;
Vertex operations
} vertex;

struct { Primitive assembly
vertex v0,v1,v2;
} triangle;
or
Rasterization
struct {
vertex v0,v1; Fragment operations
} line;
or Framebuffer
struct {
vertex v0; Display
} point; Centre for Computational Technologies

Primitive assembly
OpenGL Application
– Group vertexes into primitives:
• points, Vertex assembly
• lines, or
• triangles Vertex operations
– Decompose polygons to triangles
– Duplicate vertexes in strips or fans Primitive assembly
In our case:
– Create two triangles from a strip: Primitive operations

Rasterization

1 3 Fragment operations
glBegin(GL_TRIANGLE_STRIP);
glColor(green);
glVertex2i(…); // 0
glVertex2i(…); // 1 Framebuffer
glColor(red);
glEnd(); 2 Display
0 Centre for Computational Technologies

Application
OpenGL
– Clip to the window boundaries Vertex assembly
• Actually to the frustum surfaces
– Perform back-face / front-face ops Vertex operations
• Culling
• Color assignment for 2-side lighting Primitive assembly
In our case
– Nothing happens
Rasterization

Fragment operations

Framebuffer

Display

Rasterization (data types)
Application
struct {
Vertex assembly
float x,y,z,w;
float r,g,b,a;
Vertex operations
} vertex;

struct { Primitive assembly
vertex v0,v1,v2
} triangle;
struct { Rasterization
short int x,y;
float depth; Fragment operations
float r,g,b,a;
} fragment; Framebuffer

Display

Rasterization
Application
OpenGL
– Determine which pixels are included in the Vertex assembly
primitive
• Generate a fragment for each such pixel Vertex operations
– Assign attributes (e.g., color) to each
fragment Primitive assembly
In our case:

Rasterization

Fragment operations

Framebuffer

Display

Fragment operations
Application
OpenGL
– Texture mapping Vertex assembly
– Fragment lighting (OpenGL 2.0)
– Fog Vertex operations
– Scissor test
Primitive assembly
– Alpha test
In our case, nothing happens: Primitive operations

Rasterization

Fragment operations

Framebuffer

Display

OpenGL Library Organization
• GLU (OpenGL Utility Library), modeling
• GLUT (GL Utility Toolkit), window system interface


Graphics Functions
• Primitive functions
• Attribute functions
• Transformation functions
• Viewing functions
• Input functions
• Control functions


Primitives
• Specified via vertices
• General schema
glBegin(type);
glVertex*(...);
...
glVertex*(...);
glEnd();

• type determines interpretation of vertices


Example: Square Outline
• Type GL_LINE_LOOP
glBegin(GL_LINE_LOOP);
glVertex2f(0.0, 0.0);
glEnd();
• z coordinate defaults to 0
• Calls to other functions are allowed between
glBegin(type) and glEnd();


Points and Line Segments

• Make sense in three dimensions


Polygons

• Polygons enclose an area

• Rendering of area (fill) depends on attributes
• All vertices must be in one plane


Polygon Restrictions
• OpenGL Polygons must be simple
• OpenGL Polygons must be convex

(a) simple, but not convex

convex

(b) non-simple


Why Polygon Restrictions?
• Non-convex and non-simple polygons are
expensive to process and render
• Convexity and simplicity is expensive to test
• Behavior of OpenGL implementation on
disallowed polygons is “undefined”
• Some tools in GLU for decomposing complex polygons
(tessellation)
• Triangles are most efficient


Polygon Strips
• Efficiency in space and time
• Reduces visual artefacts

• Polygons have a front and a back, possibly with
different attributes!


Attributes
• Part of the state of the graphics pipeline
• Set before primitives are drawn
• Remain in effect!
• Examples:
– Color, including transparency
– Reflection properties
– Shading properties


Color Spaces
• RGB (Red, Green, Blue)
– Convenient for display
– Can be unintuitive (3 floats in OpenGL)
• HSV (Hue, Saturation, Value)
– Hue: what color
– Saturation: how far away from gray
– Value: how bright
• Others for movies and printing


Example: Drawing a shaded polygon
• Initialization: the “main” function
int main(int argc, char** argv)
{
glutInit(&argc, argv);
glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB);
glutInitWindowSize (500, 500);
glutInitWindowPosition (100, 100);
glutCreateWindow (argv[0]);
init ();
glutDisplayFunc(display);
glutReshapeFunc(reshape);
glutKeyboardFunc (keyboard);
glutMainLoop();
return 0;
}


GLUT Callbacks
• Window system independent interaction

• glutDisplayFunc(display);
• glutReshapeFunc(reshape);
• glutKeyboardFunc (keyboard);

• glutMainLoop processes events


Initializing Attributes
• Separate in “init” function
void init(void)
{
glClearColor (0.0, 0.0, 0.0, 0.0);
/* glShadeModel (GL_FLAT); */
glShadeModel (GL_SMOOTH);
}


The Display Callback
• Handles exposure events
• Install with glutDisplayFunc(display)

void display(void)
{
glClear (GL_COLOR_BUFFER_BIT); /* clear buffer */
triangle (); /* draw triangle */
glFlush (); /* force display */
}


Drawing
• In world coordinates; remember state!
void triangle(void)
{
glBegin (GL_TRIANGLES);
glColor3f (1.0, 0.0, 0.0); /* red */
glVertex2f (5.0, 5.0);
glColor3f (0.0, 1.0, 0.0); /* green */
glVertex2f (25.0, 5.0);
glColor3f (0.0, 0.0, 1.0); /* blue */
glVertex2f (5.0, 25.0);
glEnd();
}


The Image
• Color of last vertex with flat shading

glShadeModel(GL_FLAT) glShadeModel(GL_SMOOTH)


Smooth Shading
• Approximating a sphere
Flat Shading Smooth Shading


Projection
• Mapping world to screen coordinates
void reshape(int w, int h)
{
glViewport (0, 0, (GLsizei) w, (GLsizei) h);
glMatrixMode (GL_PROJECTION);
glLoadIdentity ();
if (w <= h)
gluOrtho2D (0.0, 30.0, 0.0, 30.0 * (GLfloat) h/(GLfloat) w);
else
gluOrtho2D (0.0, 30.0 * (GLfloat) w/(GLfloat) h, 0.0, 30.0);
glMatrixMode(GL_MODELVIEW);
}


Viewport
• Determines clipping in window coordinates
• glViewPort(x, y, w, h)


Orthographic Projection
• 2D and 3D versions
• glOrtho2D(left, right, bottom, top)
• In world coordinates!


Reminder
• Programming Assignment 1 out today
• Due in two weeks
• Compilation instructions on course page together with
assignment


Questions?


OpenGL Basics

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (20)

Andere mochten auch

Andere mochten auch (20)

Ähnlich wie OpenGL Basics

Ähnlich wie OpenGL Basics (20)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

OpenGL Basics