# Computer Graphics Conceptual Model - UML Computer Science

```					10/5/2012 13:51                                                            1

Computer Graphics
Conceptual Model

API

Output
Devices
Application
Application    Program              Graphics
Model                              System

Input
Devices

Function Calls
or Protocol

Data

UML
10/5/2012 13:51                                                                    2

Mathematical Basis for Graphics

Affine Space     Representations in a frame:
Homogeneous Coordinates


Scalars                     1 
 
 2 
Vectors                      3 

 1    0 
 
 
2
Points            

 3      
 11 12     13  14 
Operations                    
 1 
         21  22    23  24 
                     
Transformation                  
 31  32    33  34 
 0
     0      0     1 


UML
10/5/2012 13:51                                                                       3

Frames and Transformations
of Representations

u1    v1 
v1          u      
v                       v2
   M   then
2
v is representation of a       
2      If:
u3     3 
v
point or vector in frame:     v3           0     0 
P0           
Q         
P
 

v  M Tu
u1 
u is representation of a    u 
      M T is of the form:
2
point or vector in frame:
u3 
 0 
 
Q

 11 12     13  14 

 21  22    23  24 
                     

 31  32    33  34 
 0
     0      0     1 


UML
10/5/2012 13:51                                                                                          4

Translation
Assumptions:
v1 , v2 , v3 are orthogonal unit vectors in R 3along the x, y, z axes
P0  origin of R 3

Translate the new frame:
u1  v1                                 u1   1   0    0    0 1 
v
u2  v2                                    0
u2            1    0    0 2 
v
                     
u3  v3                                  3   0
u             0    1    0 3 
v
Q0  P0   xv1   yv2   z v3         0   x
  
Q            y   z   1  0 
 
P

1
   0 0  x 

0   1 0  y 
Ttranslate   M 
T
           
0
   0 1  z 


0   0 0 1 
UML
10/5/2012 13:51                                                                                         5

Scaling

Scale the new frame:

u1   x v1                        
u1   x       0       0         v
0  1 
u2   y v 2                0
u2            x         0    0  2 
v
                            
u3   z v3                 u
 3  0        0    x           v
0  3 
Q0  P0                    0  0
  
Q                 0       0    1  0 
 
P


 x       0       0       0 
0        x      0       0 
Tscale    M  
T

0        0       x      0 
0
         0       0       1 


UML
10/5/2012 13:51                                                                                         6

Rotation
v2
Rotation around the z axis:                  u2

u1  cos(q )v1  sin(q )v2                                        u1
u2  sin(q )v1  cos(q )v2
u3  v3                                                    q
v1
Q0  P0

u1  cos(q ) sin(q )          0 0  1 
v                           q ) sin(q )
cos(              0 0 
  
u2     sin(q ) cos(q )          0 0  2 
v                           q ) cos(q )
sin(              0 0 
                                       Trotate Z   M 
T
                     
u
 3   0         0                    v
1 0  3                       0      0        1 0 
 0   0
  
Q                   0             0 1  0 
 
P                           0
        0        0 1 


UML
10/5/2012 13:51                                                               7

Rotation

Similar derivations give:

1
    0       0       0 
 cos(q ) sin(q )
0                    0 
Trotate X    M  
T

 sin(q ) cos(q )
0                    0 


0    0       0       1 


cos(q )   0 sin(q ) 0
 0        1    0    0
Trotate Y    M  
T

sin(q )
          0 cos(q ) 0
 0
          0    0    1


UML
10/5/2012 13:51                                                                   8

Concatenation of Transformations

Apply T1, Then apply T2:

T2 (T1 (p))  (T2T1 )(p)

T3 (T2 (T1 (p)))  T3 (T2 T1 )(p)  (T3T2 T1 )(p)

This is important, because it allows a single
transformation matrix to stand for any sequence of
transformations.

UML
10/5/2012 13:51                                                                   9

Instance Transformation
One Common Sequence of Transforms

y          S       y   R           y   T       y

x           x               x             x

z                           z               z           z

Model
Coordinates

UML
10/5/2012 13:51                                                         10

Transformation Matrices in OpenGL 1.x – 2.x

Matrix Mode = GL_MODELVIEW

3D        Current                   Current      2D
Model                    3D
Vertices
Vertices
Stack                     Stack

Modelview                 Projection

UML
10/5/2012 13:51                                                                  11

OpenGL Matrix Operations

Loads an identity matrix onto the top of the current stack

Loads arbitrary matrix onto top of the current stack

glMultMatrixf(pointer_to_matrix);

Postmultiplies current matrix by arbitrary matrix

Matricies are one-dimensional arrays of type GLfloat
in column major order.

UML
10/5/2012 13:51                                                                     12

Predefined Postmultiplier Operators
in OpenGL

glTranslatef(dx, dy, dz);

Multiplies current matrix with translation matrix. dx,
dy, and dz are translations along x,y, and z axes.

glRotatef(angle, x, y, z);

Multiplies current matrix with rotation about the line
from the origin through the point (x, y, z) by angle.
Right hand rule applies.

glScalef(sx, sy, sz);

Multiplies current matrix with scaling matrix. sx, sy, sz
are the scale factors along the x, y, and z axes.

UML
10/5/2012 13:51                                                                                    13

Graphics: Conceptual Model
Modeling the “Synthetic Camera”

Real Light

Human Eye
Real Object

Synthetic           Synthetic
Light Source         Camera

Human Eye
Synthetic
Real Object                 Model
Display
Device

Graphics System                      UML
10/5/2012 13:51                                                14

Perspective Projection
3D Object

Image (2D)

Projection Plane

COP
UML
10/5/2012 13:51                                            15

Classical Viewing:
Parallel Projection
3D Object

Image

DOP

Projection Plane

UML
10/5/2012 13:51                                                      16

Viewing in Computer Graphics
Projection “Transforms”
Projection Plane (Image)
3D Object

Transform =
mapping

 t 
x                             x 
 
yt                            y 
                            
 t 
z                T            z 
1 
                            
 
1
UML
10/5/2012 13:51                                                                   17

Orthographic Viewing Transform
(for OpenGL where DOP is z-Axis direction)
xp  x
What we want:        yp  y
zp  0

x p    
1   0 0 0 x 
y      
0   1 0 0 y 
                
p
What we use:
z p    
0   0 0 0 z 
1 
       

0   0 0 1  
  
1

Transformation is:
•Affine (example of a scaling)
•Singular (no inverse exists because z information lost)

UML
10/5/2012 13:51                                                    18

OpenGL
Canonical Orthographic View Volume
y

Plane z= -1

Plane z= +1

x

DOP
Projection Plane
z

UML
10/5/2012 13:51                                                                   19

General OpenGl
Orthographic Projection
glOrtho**(xmin, xmax, ymin, ymax, zmin, zmax);

( xmax , ymax , zmax )      (11,1)
,

P

( 1,1,1)
( xmin , ymin , zmin )

UML
10/5/2012 13:51                                                                                              20

General OpenGL
Orthographic Projection

       2
0              x max  xmin 
xmax
0             0
    1   0 0   
 x min                                                         2      
                        2                                      y  ymin 
       0                              0         0     0
   1 0    max         
P =                  ymax    ymin                                         2
2                         z  zmin 
       0                0                       0    
0   0 1    max         
                                 z max  zmin        
2


       0                0              0        1 
   
0   0 0         1       

Translate View
Scale View Volume                                 Volume

UML
10/5/2012 13:51                                                                             21

General OpenGL
Orthographic Projection
       2                                  x max  x min 
0        0     
xmax    x min                            x max  x min 
                        2                 ymax  ymin 
       0                         0                     
ymax    ymin            ymax  ymin
P=                                                           
                       2                 zmax  zmin 
0        0                            
                   zmax  z min           zmax  zmin 

  0        0            0                      1        

 0 0
1                   0
 1 0
0                   0
Zeroed by postmult by:                      
 0 0
0                   0
 0 0

0                   1 


glOrtho(GLdouble xmin, GLdouble xmax,
GLdouble ymin, GLdouble ymax,
GLdouble zmin, GLdouble zmax )

UML
10/5/2012 13:51                                           22

Classical Viewing:
Perspective Projection
Object

Projection Plane

COP
UML
10/5/2012 13:51                                                23

Synthetic Camera

y

X

(x,y,z)

Z
Xp, Yp, -d

d

UML
10/5/2012 13:51                                                                 24

Synthetic Camera Projection Geometry

Y                        Projected Point
(x’,y’,z’)
X                                    x,y,z

d
-Z
COP
(0,0,0)
Projection Plane

x’ = x (d/z)
y’ = y(d/z)
z’ = d
UML
10/5/2012 13:51                                                                      25

Perspective Viewing

y                (x, y, z)

Proj. Plane: z p  d
(0,0,-d)
x
xp  
x                            z/d
COP                                                y
yp  
z/ d
z
Equations are non linear.
Therefore cannot use linear,
affine transformation.

UML
10/5/2012 13:51                                                                                 26

Perspective Division
 0 0 0 
1
 1 0 0 
0
Consider the transformation matrix:             M   0 1 0 
0
                 
1
 0 
0               0 
           d     
wx
x   x                              wy
y   y      If we allow the form   to represent a point,
M     z                             wz 
z   z                              w 
 
1   
   d 
we can recover the original form by division by w.
This is called perspective division.
 x 
x   z / d  x p 
y   y  y 
The transformation M                 
p

z       z / d  z p 
then yields:                    d 
1  
               1 
 
 1                     UML
10/5/2012 13:51                                                           27

Canonical Perspective Transformation

y
z = zfar

z = znear

COP
x
z

Projection Plane

UML
10/5/2012 13:51                                                                          28

Canonical Perspective Transformation:
Transformation of View Volume

y
y
z = zfar                                   z = -1
z = znear

COP                              M                                 x
x
z

z     z=1
DOP

Orthographic projection is applied
as last step to project to plane z = 0.

UML
10/5/2012 13:51                                                         29

General OpenGL Perspective Transformation
y

x
z

glFrustum ( l, r, b, t, n, f )

 2n              rl
0                   0 
r  l            rl             
         2n      t b            
M    0      t b     t b
0 
               ( f  n)   2 fn 
 0        0                      
f n      f n
                                 
 0       0         1        0      UML
10/5/2012 13:51                                              30

Canonical Transformation of View Volume
In OpenGL
f

n

COP
z

x

z

Z=+1   Z=-1
UML
10/5/2012 13:51                                                               31

General OpenGL Perspective Transformation:
Another form

gluPerspective(fovy, aspect, zNear, ZFar);

fovy Specifies the field of view angle
in degrees, in the y direction.

aspect Specifies the aspect ratio
that determines the ratio of width to height.

zNear Specifies the distance from the viewer to
the near clipping plane, always positive.

zFar Specifies the distance from the viewer to the
far clipping plane, always positive.

UML
10/5/2012 13:51                                                          32

Projection Matrices in OpenGL

glOrtho()
glFrustum()
gluPerspective()

Matrix Mode = GL_PROJECTION

3D        Current                  Current       2D
Model                     3D                      To
Vertices                                           Viewport
Vertices
Transform
Stack                      Stack

Modelview                Projection

UML
10/5/2012 13:51                                                                                                                        33

Graphics Pipeline in OpenGL
Model Coordinates                    Eye Coordinates                                          Normalized Coordinates
y
z = zfar
y

Modelview                      z = znear                Projection                     z = -1
Transform                                               Transform

z=1

COP
x
x
z

z

glScalef()                                          glFrustum()
glRotatef()                                         gluPerspective()
glTranslatef()

Projected                                                 Window Coordinates
Normalized Coordinates
y
(1,1)

x
Viewport
Transform

glViewport()
(-1,-1)

UML
10/5/2012 13:51                                                                     34

Hidden Surface Removal
Z - Buffer Algorithm
2
Projection Plane
1

z2
COP
z1

Z1 < Z2 Therefore red pixel from object 2
does not replace green pixel from object 1

Without z buffering enabled, red object, drawn last,
would be drawn over green object.

UML
10/5/2012 13:51                                                     35

Initializing and using Z-Buffer in GLUT/OpenGL

Allocating the buffer:

glutInitDisplayMode(GLUT_RGB|GLUT_DEPTH);

Enable depth testing:

glEnable(GL_DEPTH_TEST);

UML
10/5/2012 13:51                                                                       36

Positioning the Camera
Initially, the camera is at (0,0,0) for perspective viewing
looking in the -z direction.

To move the camera away from modeled objects distance
d along the the positive z axis:

glTranslatef(0.0, 0.0, -d);

What you are really doing is translating the modeled objects
in the negative z direction.

If you want to look at the model from the positive x direction
at a distance d:

glTranslatef(0.0, 0.0, -d);
glRotatef(-90.0, 0.0, 1.0, 0.0);

UML
10/5/2012 13:51                                                                    37

A More Intuitive Approach
Offered by glu:

gluLookAt(eyex, eyey, eyez, atx, aty, atz,
upx, upy, upz);

eyex, eyey, eyez specify the position of the eye
point and are mapped to the origin.

atx, aty, atz specify a point being looked at, that will
be rendered in center of viewport. It is
mapped to the -z axis.

upx, upy, upz specify components of the camera
up vector

UML
10/5/2012 13:51                                                                  38

Double Buffering

Frame Buffer 1(drawing)

Bit n

Bit 4
Bit 3
Bit 2
Bit 1
Graphics                                           Display
System     Frame Buffer 2 (displaying)

Bit n

Bit 4
Bit 3
Bit 2
Bit 1

UML
10/5/2012 13:51                                                                  39

Double Buffering

Frame Buffer 1(displaying)

Bit n

Bit 4
Bit 3
Bit 2
Bit 1
Graphics                                           Display
System     Frame Buffer 2 (drawing)

Bit n

Bit 4
Bit 3
Bit 2
Bit 1

UML
10/5/2012 13:51                                                                       40

Double Buffering:
Implementation in GLUT/OpenGL

Allocation of two frame buffers:

glutInitDisplayMode(GLUT_RGB|GLUT_DEPTH|GLUT_DOUBLE);

Swapping the buffers:

display()

{

// Stuff being drawn into back buffer goes here

glutSwapBuffers();       //makes back buffer the active buffer

}

UML
10/5/2012 13:51                                                                                    41

Simple Animation in GLUT
Method 1: Use Idle Callback Function

Idle Function
No    Event
Make
Changes               in
To Model;
Queue
Post
Display
Event
Yes

Pop                        Call
Display Event                  Function n
Call
From Queue
Function n
Call
Function n
Call
Function n
Draw
Call
Scene
Function n
Call Display
Callback

UML
10/5/2012 13:51                                                                                  42

Simple Animation in GLUT
Method 2: Use Timer Callback Function

Idle Function
No    Event
Not Used             in
Queue

Yes
Pop                        Make Scene
Display or                    Changes;
Timer Event                    Post Display Event
From Queue

Draw Scene;
Register Timer
Function
Select Display
Or Timer

UML
10/5/2012 13:51                                                                                            43

7.19 glutTimerFunc
glutTimerFunc registers a timer callback to be triggered in a specified
number of milliseconds.

Usage

void glutTimerFunc(unsigned int msecs,void
(*func)(int value), value);

Description

glutTimerFunc() registers the timer callback function to be triggered in
at least msecs milliseconds. The value parameter to the timer callback will
be the value of the value parameter to glutTimerFunc. Multiple timer
callbacks at same or differing times may be registered simultaneously. The
number of milliseconds is a lower bound on the time before the callback is
generated. GLUT attempts to deliver the timer callback as soon as possible after
the expiration of the callback’s time interval.

UML
10/5/2012 13:51                                                                                                    44

Graphics Pipeline Example (from a Midterm)
0  1            0 0
1 0              0 0
1. In an OpenGL program, the MODELVIEW matrix is:                     
0 0              1 0
                    
0 0              0 1
1 0   0   0
0 1   0   0
The PROJECTION matrix is:             
0 0  0.5 0
           
0 0   0   1

Will the drawn images be viewed in a parallel or perspective projection? How do you
know this?

2. If the matrices are as in problem 6, and the OpenGL vertex command:

glVertex3f(0.0, 0.5, -1.5);

is called, what is the homogeneous coordinates representation of the vertex? What
are the homogeneous coordinates of the vertex after it has been transformed and
projected?

3. If the window size is 500 x 500 pixels, and the viewport is given by:

glViewport(100, 100, 200, 200)

at about what pixel coordinate will the vertex of question 7 be drawn (assuming (0,0)
in the lower left corner)? Hint: remember the coordinates of the canonic projection
plane.

UML
10/5/2012 13:51                                                                                                    45

Graphics Pipeline Example2 (from a Midterm)
0             1 0  1
 1           0 0 2
7. In an OpenGL program, the MODELVIEW matrix is:                      
0             0 1 0
                     
0             0 0 1
1        0   0  0
0        1 0    0
The PROJECTION matrix is:                   
0        0  3  4
                  
0        0 1 0 

Will the drawn images be viewed in a parallel or perspective projection?

8. If the matrices are as in problem 7, and the OpenGL vertex command:

glVertex3f(1.0, 1.0, -1.5);

is called, what are the homogeneous coordinates of the vertex? What are the
homogeneous coordinates of the transformed and projected vertex?

9. If the window size is 400 x 400 pixels, and the viewport is given by:

glViewport(100, 100, 300, 300)

at about what pixel coordinate will the vertex of question 8 be drawn (assuming (0,0)
in the lower left corner)? Hint: remember the coordinates of the canonic projection
plane.
UML

```
DOCUMENT INFO
Shared By:
Categories:
Tags:
Stats:
 views: 6 posted: 10/5/2012 language: Latin pages: 45