1. Figures based on regular polygons (lab3)
A polygon is regular if it is simple, if all its sides have equal lengths, and if adjacent sides meet at equal interior angles.
name n-gon to a regular polygon having n sides. Familiar examples are the 4-gon (a square), a 5-gon (a regular pentagon), 8-gon (a regular octagon),
If the number of sides of an n-gon is large the polygon approximates a circle in appearance. In fact this is used later as one way to implement the drawing of a circle.
The vertices of an n-gon lie on a circle, the so-called parent circle of the n-gon, and their locations are easily calculated.

2. Finding vertices of ngon

3. ngon
void ngon(int n, float cx, float cy, float radius, float rotAngle)
{ // assumes global Canvas object, cvs
if(n < 3) return; // bad number of sides
double angle = rotAngle * / 180; // initial angle
double angleInc = 2 * /n; //angle increment
…// moveTo(radius * cos(angle) + cx, radius * sin(angle) + cy);
for(int k = 0; k < n; k++) // repeat n times {
angle += angleInc;
… //connect (radius * cos(angle) + cx, radius * sin(angle) + cy); }

4. Variation of n-gons
stellation formed by connecting every other vertex.
rosette, formed by connecting each vertex to every other vertex.

5. Rosette void Rosette(int N, float radius) {
Point2 pt[big enough value for largest rosette];
generate the vertices pt[0],. . .,pt[N-1], as in Figure 3.43
for(int i = 0; i < N - 1; i++)
for(int j = i + 1; j < N ; j++)
…//.moveTo(pt[i]);
… // connect all the vertices alternatively }

6. Drawing Circles void drawCircle(Point2 center, float radius) { }
const int numVerts = 50; // use larger for a better circle
ngon(numVerts, center.getX(), center.getY(), radius, 0); }

7. Drawing Arcs
void drawArc(Point2 center, float radius, float startAngle, float sweep)
{ // startAngle and sweep are in degrees
const int n = 30; // number of intermediate segments in arc
float angle = startAngle * / 180; // initial angle in radians
float angleInc = sweep * /(180 * n); // angle increment
float cx = center.getX(), cy = center.getY();
…//moveTo(cx + radius * cos(angle), cy + radius * sin(angle));
for(int k = 1; k < n; k++, angle += angleInc)
….//connect all the points: (cx + radius * cos(angle), cy + radius * sin(angle)); }

8. Order of Transformation Matters
Scale, translate
Translate scale
Rotate, Translate
Translate, Rotate

9. An Example Line (A,B) , A=(0,0,0) B=(1,0,0) S=(2,2,1) T=(2,3,0)
First Scale, then Translate
A’=(0,0,0) B’=(2,0,0); A’’=(2,3,0); B’’=(4,3,0)
First Translate, then Scale
A’=(2,3,0) B’=(3,3,0); A’’=(4,6,0); B’’=(6,6,0)

10. OpenGL Transformations
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

11. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
Objectives
Learn how to carry out transformations in OpenGL
Rotation
Translation
Scaling
Introduce OpenGL matrix modes
Model-view
Projection
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

12. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
OpenGL Matrices
In OpenGL matrices are part of the state
Multiple types
Model-View (GL_MODELVIEW)
Projection (GL_PROJECTION)
Texture (GL_TEXTURE) (ignore for now)
Color(GL_COLOR) (ignore for now)
Single set of functions for manipulation
Select which to manipulated by
glMatrixMode(GL_MODELVIEW);
glMatrixMode(GL_PROJECTION);
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

13. Current Transformation Matrix (CTM)
Conceptually there is a 4 x 4 homogeneous coordinate matrix, the current transformation matrix (CTM) that is part of the state and is applied to all vertices that pass down the pipeline
The CTM is defined in the user program and loaded into a transformation unit C
p’=Cp p
vertices
CTM
vertices
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

14. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
CTM operations
The CTM can be altered either by loading a new CTM or by postmutiplication
Load an identity matrix: C  I
Load an arbitrary matrix: C  M
Load a translation matrix: C  T
Load a rotation matrix: C  R
Load a scaling matrix: C  S
Postmultiply by an arbitrary matrix: C  CM
Postmultiply by a translation matrix: C  CT
Postmultiply by a rotation matrix: C  C R
Postmultiply by a scaling matrix: C  C S
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

15. Rotation about a Fixed Point
Start with identity matrix: C  I
Move fixed point to origin: C  CT1
Rotate: C  CR
Move fixed point back: C  CT2
Note that T2 = T1-1
Result of Postmultiplication: C = T1R T2 which is not we want.
(remember that the first matrix applied is on the far right)
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

16. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
Reversing the Order
We want C = T2 R T1
so we must do the operations in the following order
C  I
C  CT2
C  CR
C  CT1
Each operation corresponds to one function call in the program.
Note that the last operation specified is the first matrix applied to vertex (far right matrix)
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

17. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
CTM in OpenGL
OpenGL has a model-view and a projection matrix in the pipeline which are concatenated together to form the CTM
Can manipulate each by first setting the correct matrix mode
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

18. Rotation, Translation, Scaling
Load an identity matrix:
glLoadIdentity()
Multiply on right:
glRotatef(theta, vx, vy, vz)
theta in degrees, (vx, vy, vz) define axis of rotation
glTranslatef(dx, dy, dz)
glScalef( sx, sy, sz)
Each has a float (f) and double (d) format (glScaled)
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

19. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
Example
Rotation about z axis by 30 degrees with a fixed point of (1.0, 2.0, 3.0)
Remember that last matrix specified in the program is the first applied
glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
glTranslatef(1.0, 2.0, 3.0);
glRotatef(30.0, 0.0, 0.0, 1.0);
glTranslatef(-1.0, -2.0, -3.0);
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

20. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
Arbitrary Matrices
Can load and multiply by matrices defined in the application program
The matrix m is a one dimension array of 16 elements which are the components of the desired 4 x 4 matrix stored by columns
In glMultMatrixf, m multiplies the existing matrix on the right
glLoadMatrixf(m)
glMultMatrixf(m)
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

21. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
Matrix Stacks
In many situations we want to save transformation matrices for use later
Traversing hierarchical data structures (Chapter 10)
Avoiding state changes when executing display lists
OpenGL maintains stacks for each type of matrix
Access present type (as set by glMatrixMode) by
glPushMatrix()
glPopMatrix()
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

22. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
Reading Back Matrices
Can also access matrices (and other parts of the state) by query functions
For matrices, we use as
glGetIntegerv
glGetFloatv
glGetBooleanv
glGetDoublev
glIsEnabled
double m[16];
glGetFloatv(GL_MODELVIEW, m);
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

23. Using Transformations
Example: use idle function to rotate a cube and mouse function to change direction of rotation
Start with a program that draws a cube (colorcube.c) in a standard way
Centered at origin
Sides aligned with axes
Will discuss modeling later
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

24. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
main.c
void main(int argc, char **argv) {
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB |
GLUT_DEPTH);
glutInitWindowSize(500, 500);
glutCreateWindow("colorcube");
glutReshapeFunc(myReshape);
glutDisplayFunc(display);
glutIdleFunc(spinCube);
glutMouseFunc(mouse);
glEnable(GL_DEPTH_TEST);
glutMainLoop(); }
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

25. Idle and Mouse callbacks
void spinCube() {
theta[axis] += 2.0;
if( theta[axis] > ) theta[axis] -= 360.0;
glutPostRedisplay(); }
void mouse(int btn, int state, int x, int y) {
if(btn==GLUT_LEFT_BUTTON && state == GLUT_DOWN)
axis = 0;
if(btn==GLUT_MIDDLE_BUTTON && state == GLUT_DOWN)
axis = 1;
if(btn==GLUT_RIGHT_BUTTON && state == GLUT_DOWN)
axis = 2; }
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

26. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
Display callback
void display() {
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glLoadIdentity();
glRotatef(theta[0], 1.0, 0.0, 0.0);
glRotatef(theta[1], 0.0, 1.0, 0.0);
glRotatef(theta[2], 0.0, 0.0, 1.0);
colorcube();
glutSwapBuffers(); }
Note that because of fixed from of callbacks, variables
such as theta and axis must be defined as globals
Camera information is in standard reshape callback
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

27. Using the Model-view Matrix
In OpenGL the model-view matrix is used to
Position the camera
Can be done by rotations and translations but is often easier to use gluLookAt
Build models of objects
The projection matrix is used to define the view volume and to select a camera lens
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

28. Model-view and Projection Matrices
Although both are manipulated by the same functions, we have to be careful because incremental changes are always made by postmultiplication
For example, rotating model-view and projection matrices by the same matrix are not equivalent operations. Postmultiplication of the model-view matrix is equivalent to premultiplication of the projection matrix
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

29. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
Smooth Rotation
From a practical standpoint, we are often want to use transformations to move and reorient an object smoothly
Problem: find a sequence of model-view matrices M0,M1,…..,Mn so that when they are applied successively to one or more objects we see a smooth transition
For orientating an object, we can use the fact that every rotation corresponds to part of a great circle on a sphere
Find the axis of rotation and angle
Virtual trackball (see text)
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

30. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
Incremental Rotation
Consider the two approaches
For a sequence of rotation matrices R0,R1,…..,Rn , find the Euler angles for each and use Ri= Riz Riy Rix
Not very efficient
Use the final positions to determine the axis and angle of rotation, then increment only the angle
Quaternions can be more efficient than either
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009

31. Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009
Interfaces
One of the major problems in interactive computer graphics is how to use two-dimensional devices such as a mouse to interface with three dimensional obejcts
Example: how to form an instance matrix?
Some alternatives
Virtual trackball
3D input devices such as the spaceball
Use areas of the screen
Distance from center controls angle, position, scale depending on mouse button depressed
Angel: Interactive Computer Graphics 5E © Addison-Wesley 2009