1. Computer Graphics - Graphics Programming -
Hanyang University
Jong-Il Park

2. Essential Functions in API
Objects
Viewer
Light sources
Material properties

3. Objects Defined by Relationship Primitive Sets of vertices
Relationship between a list of vertices and the object
Relationship
Simple relationship
Line segments, rectangles, polygons, …
Complex relationship
Circle defined by 3 points or center and one point
Primitive
Points, line segments, polygons, text …

4. Eg. Triangle in OpenGL glBegin(GL_POLYGON); glVertex3f(0.0, 0.0, 0.0);
glEnd();

5. Viewer = Virtual Camera
Necessary specifications
Position
Orientation
Focal length
Film plane

6. Eg. Viewer in OpenGL Independence Viewer  Objects
cf. Classical viewing techniques in architecture
gluLookAt(cop_x, cop_y, cop_z, at_x, at_y, at_z, …);
// position and orientation
gluPerspective(field_of_view, aspect_ratio …);
// lens, field of view..

7. Perspective vs. Orthographic
Perspective projection
Orthographic projection

8. Viewport
glViewport(x,y,w,h)

9. Modeling-Rendering Paradigm
M+A+R
3D Studio
SOFTIMAGE
MAYA …
M+R
Rhinoceros
solidThinking …
A+R
ArcRender …
Modeling software
Animation software
Rendering software

10. Graphics Architecture
Early graphics systems
Display processors

11. Pipeline Architectures
Principle
Throughput
The rate at which the data flows through the system
Latency
The time for a datum to pass through the system

12. Geometric Pipeline Geometric processing
Transformation
Concatenating
Clipping
Projection
Rasterization = scan-conversion

13. OpenGL API Graphics functions Primitive functions Attribute functions
Viewing functions
Transformation functions
Input functions
Control functions

14. OpenGL Pipeline

15. OpenGL Data Types For portability
Eg. glVertex2f() f: suffix standing for GLfloat
Suffix
Typical C/C++
OpenGL type name b
signed char
GLbyte s
short
GLshort i
int or long
GLint, GLsizei f
float
GLfloat d
double
GLdouble ub
unsigned char
GLubyte us
unsigned short
GLushort ui
unsigned int or long
GLuint, GLenum

16. Primitives and Attributes
Points and line-segment types
glBegin(type);
glVertex*(…); …
glEnd();

17. Polygon types

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

19. Initialize GLUT and processes command line options
“Hello World” Example
#include <stdio.h>
#include <GL/glut.h>
void display(void)
{  glClear( GL_COLOR_BUFFER_BIT);  glColor3f(0.0, 1.0, 0.0);  glBegin(GL_POLYGON); glVertex3f(2.0, 4.0, 0.0); glVertex3f(8.0, 4.0, 0.0); glVertex3f(8.0, 6.0, 0.0); glVertex3f(2.0, 6.0, 0.0);  glEnd();  glFlush(); }
int main(int argc, char **argv)
{ printf("hello world\n"); glutInit(&argc, argv); glutInitDisplayMode ( GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH);
  glutInitWindowPosition(100,100); glutInitWindowSize(300,300); glutCreateWindow ("square");
  glClearColor(0.0, 0.0, 0.0, 0.0); glMatrixMode(GL_PROJECTION); glLoadIdentity(); glOrtho(0.0, 10.0, 0.0, 10.0, -1.0, 1.0);
  glutDisplayFunc(display); glutMainLoop();
  return 0;
#include <stdio.h>
#include <GL/glut.h>
int main(int argc, char **argv)
{ printf("hello world\n");
glutInit(&argc, argv);
glutInitDisplayMode (GLUT_SINGLE |
GLUT_RGB | GLUT_DEPTH);
Initialize GLUT and processes command line options

20. glutInitDisplayMode();
glutInitDisplayMode();
RGB
red, green, and blue, typically 8 bits per pixel
GLUT_RGB A
alpha or accumulation buffer; used for compositing images
GLUT_RGBA Z
depth value, used for Z-buffer visibility tests
GLUT_DEPTH
double buffer
extra copy of all buffers, used for smooth animation
GLUT_DOUBLE
stencil buffer
several extra bits, useful in compositing images
GLUT_STENCIL

21. “Hello World” Example (2)
Set window position, size, and name
And create a window
#include <stdio.h>
#include <GL/glut.h>
void display(void)
{  glClear( GL_COLOR_BUFFER_BIT);  glColor3f(0.0, 1.0, 0.0);  glBegin(GL_POLYGON); glVertex3f(2.0, 4.0, 0.0); glVertex3f(8.0, 4.0, 0.0); glVertex3f(8.0, 6.0, 0.0); glVertex3f(2.0, 6.0, 0.0);  glEnd();  glFlush(); }
int main(int argc, char **argv)
{ printf("hello world\n"); glutInit(&argc, argv); glutInitDisplayMode ( GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH);
  glutInitWindowPosition(100,100); glutInitWindowSize(300,300); glutCreateWindow ("square");
  glClearColor(0.0, 0.0, 0.0, 0.0); glMatrixMode(GL_PROJECTION); glLoadIdentity(); glOrtho(0.0, 10.0, 0.0, 10.0, -1.0, 1.0);
  glutDisplayFunc(display); glutMainLoop();
  return 0;
glutInitWindowPosition(100,100); glutInitWindowSize(300,300); glutCreateWindow ("square");
Clear color (white) and
Set the viewer
glClearColor(0.0, 0.0, 0.0, 0.0); glMatrixMode(GL_PROJECTION); glLoadIdentity(); glOrtho(0.0, 10.0, 0.0, 10.0, -1.0, 1.0);
* GL_MODELVIEW

22. “Hello World” Example (3)
Display call-back function
 glClear( GL_COLOR_BUFFER_BIT); // screen clear  glColor3f(0.0, 1.0, 0.0); // set the color to G glBegin(GL_POLYGON); // draw glVertex3f(2.0, 4.0, 0.0); glVertex3f(8.0, 4.0, 0.0); glVertex3f(8.0, 6.0, 0.0); glVertex3f(2.0, 6.0, 0.0);  glEnd();  glFlush(); // send all output to display
#include <stdio.h>
#include <GL/glut.h>
void display(void)
{  glClear( GL_COLOR_BUFFER_BIT);  glColor3f(0.0, 1.0, 0.0);  glBegin(GL_POLYGON); glVertex3f(2.0, 4.0, 0.0); glVertex3f(8.0, 4.0, 0.0); glVertex3f(8.0, 6.0, 0.0); glVertex3f(2.0, 6.0, 0.0);  glEnd();  glFlush(); }
int main(int argc, char **argv)
{ printf("hello world\n"); glutInit(&argc, argv); glutInitDisplayMode ( GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH);
  glutInitWindowPosition(100,100); glutInitWindowSize(300,300); glutCreateWindow ("square");
  glClearColor(0.0, 0.0, 0.0, 0.0); glMatrixMode(GL_PROJECTION); glLoadIdentity(); glOrtho(0.0, 10.0, 0.0, 10.0, -1.0, 1.0);
  glutDisplayFunc(display); glutMainLoop();
  return 0;
glutDisplayFunc() registers the call-back
function.
glutMainLoop() hands execution control
over to the glut library
glutDisplayFunc(display);
glutMainLoop();

23. Run and you get

24. Summary Essential Components
Main program  main() function
Display callback function
Optionally, interaction function
Mouse callback function
Keyboard callback function
Reshape callback function

25. Interaction glutMouseFunc(myMouse) glutMotionFunc(myMovedMouse)
registers myMouse() with the event that occurs when the mouse button is pressed or released
glutMotionFunc(myMovedMouse)
registers myMovedMouse() with the event that occurs when the mouse is moved while one of the buttons is pressed
glutKeyboardFunc(myKeyboard)
Registers myKeyboard() with the event that occurs when a keyboard key is pressed

26. Eg. Placing Dots with Mouse
Leftbutton  draw a dot
Rightbutton  terminate
void drawDot(GLint x, GLint y) {
glBegin(GL_POINTS);
glVertex2i(x,y);
glEnd(); }
void myMouse(int button, int state, int x, int y) {
if(button == GLUT_LEFT_BUTTON &&
state == GLUT_DOWN)
drawDot(x,screenHeight –y);
else if(button == GLUT_RIGHT_BUTTON &&
exit(-1); }

27. Pen-Plotter Model moveto(0,0); lineto(1,0); lineto(1,1); lineto(0,1);
Used in early graphics systems
LOGO, GKS, PostScript…

28. Homework #3 2D Graphics Programming [OpenGL] Read Chap.4
[Due: 12 Oct.]
2D Graphics Programming [OpenGL]
Open a window with 480 lines x 640 pixels
Build your own paint program capable of drawing dots, lines, line strips, line loop, …
Interaction: Use the mouse and the keyboard
Hint: Follow the methods in Chap.3 of the textbook
Read Chap.4