CS405 Lab 3: Matrix Transformation


Highlights of this lab:

This lab is an introduction to Matrix Transformation

Assignment

After the lab lecture, you have approximately two weeks of time to:

Online OpenGL Manual


Lecture Notes

A. A Simplified View of the OpenGL Pipeline

B. Elementary Transformation

Translation:

Rotation:

Scaling

C. The Order of Transformations

D. Modeling Transformation v.s. Viewing Transformation

OPTIONAL

The gluLookAt() Function: define a viewing transformation

void gluLookAt( GLdouble eyex, GLdouble eyey, GLdouble eyez,
                 GLdouble centerx, GLdouble centery, GLdouble centerz,
                 GLdouble upx, GLdouble upy, GLdouble upz )
Parameters
  eyex, eyey, eyez: specifies the position of the eye point;
  centerx, centery, centerz: specifies the position of the reference point;
  upx, upy, upz: specifies the direction of the up vector.

Note that, these parameters are equivalent to the camera parameters specified in the textbook:

The gluLookAt() function makes it easy to move both the "from" and the "to" points in a linear manner. For example, if you need to pan along the wall of a building located away from the origin and aligned along no axes in particular, you could simply take the "to" point to be one corner of the building and calculating the "from" as a constant distance from the "to" point. To pan along the building, just vary the "to" point.

Mmodelview = Mviewing * Mmodeling

What this means is that your viewing transformations must be entered into the Modelview matrix before modeling transformations.

E. Manipulating the Matrix Directly

F. Viewport and Projection Transformations

G. An Example

The following program makes use of the glut library. If you are working at home, you might have to put this library on your computer.

The following program can be created in Visual Studio using these instructions:

// main.cpp
//
// This is an example of a program using glut

#include <GL/glut.h>


void init(void)
{
        glClearColor(0.0, 0.0, 0.0, 0.0);
        glShadeModel(GL_FLAT);
}


void display(void)
{
        glClear(GL_COLOR_BUFFER_BIT);
        glColor3f(1.0, 1.0, 1.0);
        glLoadIdentity();  /*clear the matrix */
                /*viewing transformation*/
        gluLookAt(0.0,0.0,5.0,0.0,0.0,0.0,0.0,1.0,0.0);


        glBegin(GL_LINES);
                glColor3f(1.0f,0.0f,0.0f); //y is red
                glVertex3i(0,2,0);
                glVertex3i(0,-2,0);
                glColor3f(0.0f,1.0f,0.0f); //x is green
                glVertex3i(2,0,0);
                glVertex3i(-2,0,0);
                glColor3f(0.0f,0.0f,1.0f); //z is blue
                glVertex3i(0,0,2);
                glVertex3i(0,0,-2);
        glEnd();

	// The following command ensures that the drawing commands are
	// actually executed rather than being stored in a buffer
	// awaiting additional OpenGL commands
        glFlush();
}


void reshape(int w, int h)
{
        glViewport(0, 0, (GLsizei) w, (GLsizei) h);
        glMatrixMode(GL_PROJECTION);
        glLoadIdentity();
        glFrustum(-1.0, 1.0, -1.0, 1.0, 1.5, 20.0);
        glMatrixMode(GL_MODELVIEW);
}


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);
        glutMainLoop();
        return 0;
}
The above code draws a basic coordinate system with a green x-axis, a red y-axis, and a blue z-axis.
Right now, you are looking directly down the z-axis so you will not see it.

For more on glut*() see the on-line manual.


Assignment

Goals of this assignment:

Part 1

Start with the example code provided in section G above and make the following changes. Write your answers to the questions in steps 1, 2, 4 and 11.

  1. Comment out the gluLookAt() call and replace it with the glTranlatef() with parameters (0.0,0.0,-5.0). Is there any change in the display? Why? Why not?
  2. Comment out both the gluLookAt() and glTranslatef() lines. What happens? Why?
  3. Restore the gluLookAt() call.
  4. Comment out the glFrustum() call and replace it with gluPerspective() with parameters (60.0, 1.0, 1.5, 20.0).
    1. What happens when you change the field of view angle to 30.0 (from 60.0)? Why?
    2. What happens when you modify the aspect ratio (from 1.0)?
  5. Restore the original glFrustum() call. (Commenting out the gluPerspective())
  6. Use a new color to draw a wirecube whose center is at (0, 0, 0). You can use glutWireCube(1.0). Add this to the "display" function.
  7. Move this cube so that it is centered at (1, 0, 0).
  8. Draw a second cube, and rotate it 45 degrees around the y-axis.
  9. Place this rotated cube directly above the first cube. It will be centered at (1, 1, 0). Be careful of the order of transformations.
  10. The perspective view makes the two cubes look a little awkward. Try using orthographic projection instead of the glFrustum call. The function for that is: glOrtho (the arguments are similar to the glFrustum, but you may want to send it larger left, right, bottom, and top values). See the picture for expected results:
  11. Rotate everything (using modeling transformations NOT gluLookAt) so that you are looking down at the top of the boxes and seeing the blue z-axis (and no red y-axis). See the picture for expected results:

    If you wanted to leave your x and y axes unchanged, but see the top of the boxes, like this:

    how would you change your code?
  12. Rotate everything so that you can see all three axes along with the two cubes. See the picture for expected results:

    You may use different angles of course.
  13. BONUS: Get started early on Lab 4. Use glEnable() or glDisable() with GL_DEPTH_BUFFER, GL_LIGHTING, GL_COLOR_MATERIAL, GL_LIGHT0; add GL_DEPTH_BUFFER_BIT to glClear(); and use glutSolidCube(1.0) in the appropriate places to make a solid lighted version of step 12 like this:

/5 marks

Part 2

Click here for some code that draws a robot arm.

  1. First build the program and see how it works. Try pressing lower and uppercase 'e' to move the elbow. Try pressing lower and uppercase 's' to move the shoulder
  2. Now, add three fingers and a thumb to the robot.
    Use glPushMatrix(); and glPopMatrix();
  3. Finally, add some code that will make the finger and thumb move apart and together when the lower and uppercase 'f' are respectively pressed.

  4. Your completed robot hand might look something like the following.

/5 marks

Deliverables

See the worksheet.