From Immersive Visualization Lab Wiki
Revision as of 21:16, 15 November 2014 by Admin (Talk | contribs)

Jump to: navigation, search


Project 5: Light and Shade

This project is on OpenGL lighting and shading, and includes GLSL shader programs.

This project is due on Friday, November 21st at 3:30pm and will be discussed in CSB 001 on Monday, November 17th at 5pm.


  • GLSL shaders will be covered in class on Tuesday, November 18th.
  • This project does not require a scene graph data structure. But we encourage you to use your scene graph for this and the remaining projects because it can make your code easier to write and debug.

1. 3D Model Loader (20 Points)

OBJ files are 3D model files which store the shape of an object with a number of vertices, associated vertex normals, and the required connectivity information to form triangles. Wikipedia has an excellent page on the OBJ file format. The file format is an ASCII text format, which means that the files can be viewed and edited with a text editor.

Here are three files for you to work with:

The files provided in this project only use the following three data types (other OBJ files may support more):

  • v: 'vertex': followed by six floating point numbers. The first three are for the vertex position (x,y,z coordinate), the next three are for the vertex color (red, green, blue) ranging from 0 to 1. Example:
    v 0.145852 0.104651 0.517576 0.2 0.8 0.4
  • vn: 'vertex normal': three floating point numbers, separated by white space. The numbers are for a vector which is used as the normal for a triangle. Example:
    vn -0.380694 3.839313 4.956321
  • f: 'face': lists three sets of indices to vertices and normals, which are the three corners of a triangle. Example:
    f 31514//31514 31465//31465 31464//31464

Lines starting with a '#' sign are comments and can safely be ignored.

Write your parser so that it goes through the OBJ file, line by line. It should read in the first character of each line and based on it decide how to proceed. Lines with parameters can be read with the fscanf command. Here is an example for vertices:

FILE* fp;     // file pointer
float x,y,z;  // vertex coordinates
float r,g,b;  // vertex color
int c1,c2;    // characters read from file

fp = fopen("bunny.obj","rb");
if (fp==NULL) { cerr << "error loading file" << endl; exit(-1); }

c1 = fgetc(fp);
c2 = fgetc(fp);
if (c1=='v') && (c2==' ')
  fscanf(fp, "%f %f %f %f %f %f", &x, &y, &z, &r, &g, &b);
// parse other cases and loop over lines of file

fclose(fp);   // make sure you don't forget to close the file when done

Once you loaded your model file, apply your full-screen algorithm from project 2.2 to scale the data sets up or down to match the screen size, and render the model. Use your rotation and scale routines to spin the model around and zoom in.

2. Mouse Control (30 Points)

Now it is time to improve on those keyboard commands for rotations of your 3D model. Add a mouse control function, to allow rotating the model about the center of your OpenGL window, as well as scaling the model up and down. The left mouse button should be used for rotation, the right mouse button should zoom in and out when the mouse is moved up or down while it is pressed.

This video shows how the trackball-like rotation should work.

The figure below illustrates how to translate mouse movement into a rotation axis and angle. m0 and m1 are consecutive 2D mouse positions. These positions define two locations v and w on an invisible 3D sphere that fills the rendering window. Use their cross product as the rotation axis a = v x w, and the angle between v and w as the rotation angle.


Horizontal mouse movement exactly in the middle of the window should result in a rotation just around the y-axis. Vertical mouse movement exactly in the middle of the window should result in a rotation just around the x-axis. Mouse movements in other areas and directions should result in rotations about an axis a which is not parallel to any single coordinate axis, and is determined by the direction the mouse is moved in.

Once you have calculated the trackball rotation matrix for a mouse drag, you will need to multiply it with the object-to-world transformation matrix of the object you are rotating.

To access the mouse x and y coordinates, you will need to use GLUT's callback functions glutMouseFunc(), which gets called when you press a mouse button, and glutMotionFunc(), which gets called constantly while you hold the button down and move the mouse. Note that successive trackball rotations must build on previous ones; at no point should the model snap back to a previous or default position.

For step by step instructions, take a look at this tutorial. Note that the tutorial was written for Windows messages, instead of GLUT mouse functions. This means that you'll need to replace the "CSierpinskiSolidsView::OnLButtonDown" function with "glutMouseFunc", "CSierpinskiSolidsView::OnMouseMove" with "glutMotionFunc", etc. To help you understand the code here is a line-by-line commented version of the trackBallMapping function:

Vec3f CSierpinskiSolidsView::trackBallMapping(CPoint point)    // The CPoint class is a specific Windows class. Either use separate x and y values for the mouse location, or use a Vector3 in which you ignore the z coordinate.
    Vec3f v;    // Vector v is the synthesized 3D position of the mouse location on the trackball
    float d;     // this is the depth of the mouse location: the delta between the plane through the center of the trackball and the z position of the mouse
    v.x = (2.0*point.x - windowSize.x) / windowSize.x;   // this calculates the mouse X position in trackball coordinates, which range from -1 to +1
    v.y = (windowSize.y - 2.0*point.y) / windowSize.y;   // this does the equivalent to the above for the mouse Y position
    v.z = 0.0;   // initially the mouse z position is set to zero, but this will change below
    d = v.Length();    // this is the distance from the trackball's origin to the mouse location, without considering depth (=in the plane of the trackball's origin)
    d = (d<1.0) ? d : 1.0;   // this limits d to values of 1.0 or less to avoid square roots of negative values in the following line
    v.z = sqrtf(1.001 - d*d);  // this calculates the Z coordinate of the mouse position on the trackball, based on Pythagoras: v.z*v.z + d*d = 1*1
    v.Normalize(); // Still need to normalize, since we only capped d, not v.
    return v;  // return the mouse location on the surface of the trackball

3. Fixed Function Lighting (30 points)

Write classes to manage light and material properties (Light and Material). As a starting point, refer to the relevant sections in Chapter 5 of the OpenGL Programming Guide, as well as the OpenGL Lighting FAQ.

Associate different material properties with each of the 3D model files: make one more shiny, another one more diffuse. Use colors other than white. (15 points)

Create two light sources: a point light and a spot light. Give them initial colors, positions, directions and opening angles as applicable. The spot light should have a spot width narrow enough so that it only illuminates a small part of the surface of the models. Draw a glutSolidSphere in the location of the point light, and a glutSolidCone in the location of the spot light, the wide end pointing in the direction of the spot. Make sure the light source positions are chosen so that both are visible on the screen. (15 points)

The lights should be stationary in world space: when the 3D model is rotated, the lights should not rotate with it.


  • OpenGL multiplies light position and direction with the Modelview matrix when they are set. Therefore, you need to modify the Modelview matrix with your mouse control routines to rotate the light sources, independently for each light source.
  • To ascertain that the normals of your 3D models will survive zoom operations correctly, you should use the following OpenGL command: glEnable(GL_NORMALIZE).
  • By default, OpenGL uses a simplified model for the calculation of the highlights. For a more realistic model add this command to your main() function: glLightModelf(GL_LIGHT_MODEL_LOCAL_VIEWER, GL_TRUE).

4. Add Per-Pixel Lighting (20 Points)

Up until now, the spot light's outline on the surface of the 3D models has been rather fuzzy. Add per pixel lighting for the spot light to your application. To accomplish this, you need to add a vertex and a fragment shader to your application and enable them. In this project, you are free to copy-paste the shader code into your application from a source of your choice, for instance Lighthouse3D. You do not need to understand the shader code, just make it work.

Toggle this per-pixel lighting mode on and off with the 'p' key. When it is enabled, you do not need to render the effect of the point light, because this would require modifying the shader.


  • While most CSE lab computers do, some older computers or simpler graphics cards do not support GLSL. Be aware that this might be a problem with your personal computer.

5. Extra Credit (10 Points)

Control the spot light with the mouse. To keep model rotations functional, the 'l' key should switch to light control mode, the 'm' key should switch back to the default model control mode.

Control the spot light's opening angle with the mouse by dragging it up or down with the right mouse button depressed. (3 points)

When the user left-clicks with the mouse on a location on the surface of the 3D model, the spot light's direction should change to point directly at the point that was clicked on. (7 points)

Note that in order to find the position on the model the user clicked on, a ray-triangle intersection algorithm is needed: at the mouse click position, a ray should be cast parallel to the z axis into the model. Then every triangle on the surface of the object needs to be tested for intersection with this ray. If there are multiple intersection points, the one closer to the camera should be used. This article on Lighthouse3D describes such an algorithm in great detail.