ED1021 - Introduction to
computation and visualisation
L13 - Introduction to Open Graphics Library (OpenGL)
Ramanathan Muthuganapathy ([Link]
Course web page: [Link]
Moodle page: Available at [Link]
OpenGL - what can be done?
Application of C programming
• To draw (render) primitive / objects / 3D shape / Scenes
• Lighting and shading
• Surfaces
• Animation
• Games
• OpenGL windowing system
• Independant of OS
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Installation instructions
• For Windows users - a video was sent with instructions.
• Mac users —->
• Project —> General —> Linked Libraries and Frameworks —> Add
[Link] and [Link]
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
OpenGL versions
1.x to 4.x
• Legacy OpenGL (before 3.0)
• Modern OpenGL (from 3.0)
• Current version is 4.6
• [Link]
History_of_OpenGL#:~:text=Official%20versions%20of%20OpenGL%20relea
sed,%2C%204.4%2C%204.5%2C%204.6.
• [Link]
• We will mostly use a very basic version (mostly 1.x)
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Resources
All are available on the web
• OpenGL Redbook - [Link] (search for
OpenGL redbook)
• Sample programs are available at [Link]
code/samples/redbook/ and
• [Link]
examples/[Link]
• [Link] (You can go and search about a particular function)
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
What does OpenGL actually consists of?
• Functions
• Application Programming Interfaces (APIs)
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
How will you access functions?
• How do you get access to scanf( )?
• Header files
• #include <GL/glut.h> (in Mac, #include <GLUT/glut.h>
• Usually sufficient
• #include <GL/gl.h>
• #include <GL/glu.h>
• #include <GL/glut.h>
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Header files
• gl.h - consists of all the rendering (drawing - model and viewing related)
functions
• glu.h - contains some utility functions
• glut.h - OpenGL windows programming functions.
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Demo
simple.c and hello.c
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Demo
simple.c and hello.c
• CW: Try the same in your computer.
• Observations?
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Observations
(name of the functions and function calls)
• some functions starts with ‘gl’, e.x.?
• some functions starts with ‘glu’, e.x.?
• some functions starts with ‘glut’, e.x.?
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Typical order
(name of the functions and function calls)
• Create a window (and some related functions)
• Initialize the window
• Render (basically ‘draw’), Resize, Input from mouse / keyboard
• Event processing loop.
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Windowing related functions
int
main(int argc, char **argv) // command line arguments
{
// Write your input statements before calling the window
glutInit(&argc, argv); // Initializing the window
glutInitWindowSize(500, 500); // Add this one
glutCreateWindow("Simple Triangle”); // Creating the window
glutDisplayFunc(display); // Call back function for display
glutReshapeFunc(reshape); // When window is resized
glutMainLoop();
return 0; /* ANSI C requires main to return int. */
}
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Locate the default origin
Comment out the glutReshapeFunc( )
void
display(void)
{
glClear(GL_COLOR_BUFFER_BIT);
glPointSize(10.0);
glColor3f(1.0, 0.0, 0.0); /* blue */
glBegin(GL_POINTS);
glVertex2i(0, 0);
glEnd();
glFlush(); /* Single buffered, so needs a flush. */
}
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Change coordinates in display function
void
display(void)
{
glClear(GL_COLOR_BUFFER_BIT);
glColor3f(0.0, 0.0, 1.0); /* blue */
glBegin(GL_POLYGON);
glVertex2i(-250, 250);
glVertex2i(250, 250);
glVertex2i(250, -250);
glVertex2i(-250, -250);
glEnd();
glFlush(); /* Single buffered, so needs a flush. */
}
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
glOrtho( ) and glViewport( )
window and screen/viewport coordinates
void
reshape(int w, int h)
{
/* Because Gil specified "screen coordinates" (presumably with an
upper-left origin), this short bit of code sets up the coordinate
system to correspond to actual window coodrinates. This code
wouldn't be required if you chose a (more typical in 3D) abstract
coordinate system. */
glViewport(0, 0, w, h); /* Establish viewing area to cover entire window. */
glMatrixMode(GL_PROJECTION); /* Start modifying the projection matrix. */
glLoadIdentity(); /* Reset project matrix. */
glOrtho(0, w, 0, h, -1, 1); /* Map abstract coords directly to window coords. */
}
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Transformations in OpenGL
Camera analogy - Fig. 3.1 in chapter 3
• Modeling
• Viewing
• Camera orientation
• Projection
• Map to Screen coordinates
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Camera Analogy
Fig. 3.1 in chapter 3 in redbook
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Coordinate systems
• Model (World coordinates)
• Camera (its coordinates)
• Project (Window coordinates)
• Viewport mapping (Screen coordinates)
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Case 1A
Square - Object to be displayed
h (-250, 250), (-250, -250),
(w, h)
(250, -250), (250, 250)
(w, h)
(w/2, h/2) Ortho(-w, w, -h, h) - Black window
Viewport(0, 0, w, h) - Red Window
-w (0,0) w
Output: Full object gets displayed
ALL OBJECTS TO BE DISPLAYED
(-w/2, -h/2) IN THE BLACK WINDOW
NOTE: In viewport, first two are the
(-w, -h) coordinates of the lower left
(0, 0) -h
But then the next two are the
SIZE of the viewport (and NOT coordinates
Of the right corner)
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Case 1B
Case 1* - Viewport(0, 0, x, y),
Square - Object to be displayed
x and y are variables
h (-250, 250), (-250, -250),
(w, h)
(250, -250), (250, 250)
(w, h)
Ortho(0, w, 0, h) - Black
window
Viewport(0, 0, w, h) - Red Window
(w/2, h/2) w
0
ALL OBJECTS TO BE DISPLAYED
IN THE BLACK WINDOW
NOTE: In viewport, first two are the
coordinates of the lower left
But then the next two are the
(0, 0)
0 SIZE of the viewport (and NOT coordinates
(0, 0) Of the right corner)
Major portion of the square
will go out of the screen but
Bigger Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Case 1C
h
Square - Object to be displayed
0 (-250, 250), (-250, -250),
(w/2, h/2) w
(250, -250), (250, 250)
(w, h)
Ortho(0, w, 0, h) - Black window
(w/2, h/2) (Actual screen)
Viewport(0, 0, w/2, h/2) - Viewport
Output: Truncated, seen at
(0,0)
(0,0) 0 Bottom left corner of black screen
(original size)
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Case 1D
h
Square - Object to be displayed
-w (w/2, h/2) w
(w, h)
(w/2, h/2)
Ortho(-w, w, -h, h) - Black window
(0,0) (Actual screen)
Viewport(0, 0, w/2, h/2) - Viewport
(-w/2, -h/2)
Output: Fully seen at
(-w, -h)
(0,0) -h Bottom quarter but smaller
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Case 2A
Case 2* - Viewport(w/2, h/2, x, y) (w, h) (w, h)
h Square - Object to be displayed
(w/2, h/2)
Ortho(0, w, 0, h) - Black window
0 w (Actual screen)
(0,0) Viewport(w/2, h/2, w, h) - Viewport
(w/2, h/2)
Output: Truncated, seen at
The middle of black screen (since ortho
Starts at 0), enlarged
0
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Case 2B
Case 2* - Viewport(w/2, h/2, x, y)
(w, h)
(w/2, h/2)
h Square - Object to be displayed
(0,0)
(w, h)
(-w/2, -h/2)
(-w, -h)
-w (w/2, h/2)
Ortho(-w, w, -h, h) - Black window
w
(Actual screen)
Viewport(w/2, h/2, w, h) - Viewport
-h
Output: Only partially seen at
Top right corner of black screen,
Same size.
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Case 2B
(-250, 250), (-250, -250),
Ortho(-w, w, -h, h) - Black window (250, -250), (250, 250)
(Actual screen) Square - Object to be displayed
h (w, h) (w, h)
(w/2, h/2)
-w (0,0) w
(-w/2, -h/2)
(-w, -h) -h (0, 0)
Viewport(0, 0, w, h) - Viewport
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Case 2B
(-250, 250), (-250, -250),
(250, -250), (250, 250)
Ortho(-w, w, -h, h) - Black window
Square - Object to be displayed
(Actual screen)
h (w,(w,
h) h)
(w/2, h/2)
-w (0,0) w
(-w/2, -h/2)
Viewport(0, 0, w, h) - Viewport
(-w,(0,
-h)0) -h
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
ViewportOrtho.c
(-250, 250), (-250, -250),
Ortho(-w, w, -h, h) - Black window (250, -250), (250, 250)
(Actual screen)
Square - Object to be displayed
h (w, h) (w, h)
(w/2, h/2)
h/2
-w (0,0) w
(w/2, h/2) w/2
(-w/2, -h/2)
Viewport(w/2, h/2, w/2, h/2) - Viewport
(-w, -h) -h
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
ViewportOrtho.c
(-250, 250), (-250, -250),
(250, -250), (250, 250)
Ortho(-w, w, -h, h) - Black window Square - Object to be displayed
(Actual screen) (w, h)
h (w
(w/
- ( w
(-w/
(w/2,(-h/2) -
Viewport(w/2, h/2, w/2, h/2) - Viewport
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
ViewportOrtho.c
(-250, 250), (-250, -250),
Ortho(0, w, 0, h) - Black window (250, -250), (250, 250)
(Actual screen)
Square - Object to be displayed
h (w, h) (w, h)
h/2)
-w
(w/2, h/2)
w
(w/2, h/2) w/2
Viewport(w/2, h/2, w/2, h/2) - Viewport
(0,0) -h
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
ViewportOrtho.c
(-250, 250), (-250, -250),
Ortho(0, w, 0, h) - Black window (250, -250), (250, 250)
(Actual screen) Square - Object to be displayed
(w, h)
h (
-
(w/ w
(
(w/2, h/2) -
Viewport(w/2, h/2, w/2, h/2) - Viewport
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Change coordinates in display function
To experiment with glViewport( ) and glOrtho( )
void
display(void)
{
glClear(GL_COLOR_BUFFER_BIT);
glColor3f(0.0, 0.0, 1.0); /* blue */
glBegin(GL_POLYGON);
glVertex2i(-250, 250);
glVertex2i(250, 250);
glVertex2i(250, -250);
glVertex2i(-250, -250);
glEnd();
glFlush(); /* Single buffered, so needs a flush. */
}
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
glOrtho( ) and glViewport( )
window and screen/viewport coordinates
void
reshape(int w, int h)
{
/* Because Gil specified "screen coordinates" (presumably with an
upper-left origin), this short bit of code sets up the coordinate
system to correspond to actual window coodrinates. This code
wouldn't be required if you chose a (more typical in 3D) abstract
coordinate system. */
glViewport(0, 0, w, h); /* Establish viewing area to cover entire window. */
glMatrixMode(GL_PROJECTION); /* Start modifying the projection matrix. */
glLoadIdentity(); /* Reset project matrix. */
glOrtho(0, w, 0, h, -1, 1); /* Map abstract coords directly to window coords. */
}
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Transformations
• Translation
• Rotation
• Scaling
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
Programming Transformations
• Prior to rendering, view, locate, and orient:
– eye/camera position
– 3D geometry
• Manage the matrices
• Combine transformations
• Transformation matrices must be defined prior to any
vertices.
• OpenGL provides matrix stacks for each type of supported
matrix (ModelView, projection etc.) to store matrices.
Transformation Pipeline (From redbook)
Normalized device coordinates
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
NCD
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras
gluPerspective( )
void gluPerspective(GLdouble fovy, GLdouble aspect,
GLdouble near, GLdouble far);
Ramanathan Muthuganapathy, Department of Engineering Design, IIT Madras