CS 352: Computer Graphics Chapter 5: Viewing. Interactive Computer GraphicsChapter 5 - 2 Overview Specifying the viewpoint Specifying the projection Types

CS 352: Computer Graphics

Chapter 5:

Viewing

Interactive Computer GraphicsChapter 5 - 2

Overview Specifying the viewpoint Specifying the projection

Types of projections Viewing APIs Walking through a scene

Projections and shadows

How do cameras work?


Synthentic camera model 1. Camera is placed at a location,

pointed in a direction (modeling matrix) 2. 3D points are flattened onto the

viewing plane (projection matrix)

What do we need to know about the camera (real or synthetic)?


Synthetic camera parameters Position of camera Direction it is pointed [look vector] Angle of film to look vector [view plane

normal] Rotation around viewing direction [up vector] Height angle (zoom setting) [fovy] Aspect ratio of "film" (width/height) Front and back

clipping planes Focal length Field of view Shutter speed



Perspective distortion How would you film dizziness? Vertigo effect [2]


http://www.youtube.com/watch?v=je0NhvAQ6fM

http://www.youtube.com/watch?v=1h9ZzYhvSyE&NR=1


Projections Basic Elements:

Objects, viewer Projection plane Projectors Center of projection Direction of

projection (DOP) Basic Types

Perspective Parallel (COP

at infinity)


Classical viewing


Orthographic projection Orthographic: parallel

projection with projectors

perpendicular to the projection plane.

Often used as front, side, top views for 3Ddesign

Importance: preservationof distance and angle

Often used for top, front, and size views, e.g. in a modeling program or working drawing


Perspective projection Perspective projections: projectors converge

at COP Classical perspective views: 1, 2, and 3-point

(1, 2, or 3 vanishing points) Difference: how many of the principle axes of

the object are parallel to projection plane (I.e., depends on relationship of object to viewing frame)


1. Position the camera By default, camera is at origin, looking in –z

dir To “move the camera”, set up a modelview

matrix that moves objects that are drawn Ignore Z-coordinate when drawing E.g. dimetric view?

modelview = identitytranslate(0,0,-d)rotate(-45,<0,1,0>);


Exercise: look from +x axis How would you change the camera to

generate a view down the +x axis to origin?

Do this before displaying objects:modelview = identity;translate(0, 0, -d);rotate(-90, [0, 1, 0]);


Exercise: front/top view How would you change the camera to

generate a view from (0, 10, 10) to origin?

Do this before displaying objects:modelview = identity;translate(0,0,-14.14);rotate(45, [1, 0, 0]);


Helper function: lookAt Most 3D toolkits let you position the

camera by setting eyepoint, lookpoint, and up direction

lookAt(Xeye, Yeye, Zeye, Xat, Yat, Zat, Xup, Yup, Zup):

Effect: set themodelview matrix

Rolling your own lookAt How could you write your own lookAt

function?

lookAt(Xeye, Yeye, Zeye, Xat, Yat, Zat, Xup, Yup, Zup):


Defining a lookAt function lookAt(Xeye, Yeye, Zeye, Xat, Yat, Zat, Xup, Yup, Zup):

translate <Xat, Yat, Zat> to origin rotate so that <Xeye, Yeye, Zeye>

points in the Z direction normalize <Xeye, Yeye, Zeye> trackball-like rotation to <0,0,1>

rotate so <Xup, Yup, Zup> is <0,1,0> trackball-like rotation



Camera API 2: uvn frame Camera parameters:

VRP: view reference point, a point on the image plane

VPN: view plane normal (n) VUP: vector in up direction (also need viewing direction, if not VPN)

Result: viewing coordinate system, u-v-n. v = projection of VUP onto image plane u = v x n u, v axes: coordinates in the image plane n axis: normal to image plane


Camera API 3: roll, pitch, yaw Specify location + orientation: roll, pitch,

yaw

2. Specify projection


Once we have located and pointed the camera along the –z axis, we still need to specify the lens (projection).

Parallel projection We’re already looking along the –z axis Set z=0 for all points (or ignore z

coordinate when rendering)



Parallel projection View volume is generally specified with

clipping planes: e.g. glOrtho(xmin, xmax, ymin, ymax, near, far)

Z clipping planes at –near and –far

Perspective projection Need to build appropriate perspective

projection matrix into vertex shader What kind of transformation would this

be?



Perspective projections COP at origin Looking in –z direction Projection plane in front of origin at z=d


Foreshortening By similar triangles in previous image,

we see that and similarly for y.

Using the perspective matrix we get p’ =

Adding divide-by-w to the graphics pipeline gives the correct result.

dzp

xx

000

0100

0010

0001

1d Tdzzyx

Perspective Frustum Perspective viewing region is a

“frustum”:

Viewplane normally coincides with front clip plane



Camera APIs In raw OpenGL ES, you “position the

camera” by programming a vertex shader to apply a modelview matrix

Frameworks provide functions to build a viewing matrix for you, using a “camera API”

Example:

perspectiveCamera(FOV, aspect, near, far)

Perspective projection 3D graphics toolkits provide tools for

specifying a perspective projection, e.g.



Shadows How can one generate shadows in a

scene using interactive graphics techniques?

In general it's hard, not supported in standard graphics pipeline—you need to know where everything is globally to render a point locally

Special techniques let you “fake it”

http://learningthreejs.com/blog/2012/01/20/casting-shadows/


Projections and shadows Projections can be used to generate

simple shadow polygons Light (xl, yl, zl) Translate light to origin Project down y axis [M] Translate back

000

0100

0010

0001

1ly


Simple Shadow in OpenGLGLfloat m[16]; //projection matrixfor (int i=0; i<16; i++) m[i]=0;m[0]=m[5]=m[10]=1;m[7] = -1/yl;glBegin(); [draw polygon normally]; glEnd();glMatrixMode(GL_MODELVIEW);glPushMatrix; //save stateglTranslatef(xl, yl, zl);glMultMatrix(m);glTranslatef(-xl, -yl, -zl);glColor3fv(shadow_color);

[draw polygon]glEnd();glPopMatrix();


Stereo Viewing In our stereo setup, we

need two images (4x3 size ratio), side-by-side

We want to render perspective views from viewpoints (say) 3 inches apart

How to set up the views?*

* “Simple, Low-Cost Stereographics: VR for Everyone,” J. Zelle & C. Figura, Proc. SIGCSE 2004 p. 348.


Direct both eyes at the same point?


Direct both eyes in parallel?


Parallel views and asymmetric frustum


Stereo viewing:// set up the projection transformation// focalLength is distance to screen (objects// closer will float in front of screen)top = eyeSeparation / 2.0 * (near / focalLength);glFrustum(-right+off, right+off, -top, top,

near, far);

// now set up the model-view transformation // right is a unit vector in right direction viewpoint = viewpoint – right * eyeOffset;center = center – right * eyeOffset;gluLookAt(viewpoint[X],viewpoint[Y],viewpoint[Z],

center[X], center[Y], center[Z], up[x], up[y], up[z]);


Drawing left and right views//create windowint width=400; int height=300;glutInitWindowSize(2*width, height);

//-------------------------------------// draw left imageglViewport (0, 0, width, height);// set up projection and modeling matrices// render image

// draw right imageglViewport (width, 0, width, height);// set up projection and modeling matrices// render image


Walking through a scene How to animate viewer motion through

a scene? [Demo] Assume viewer’s height is fixed;

looking direction is in y=6 plane Store viewer’s location (x,6,z) and

orientation (θ). Update appropriately with user commands

LookAt( x, y, z, x + cos(θ), y, z + sin(θ), 0, 1, 0);

http://www.ambiera.com/coppercube/demo.php?demo=3rdpersoncam&mode=webgl

Credits 1. (Pinhole camera): Wikipedia. 5. Synthetic camera parameters: Liz Marai, Pitt

Demos Musical solar system


http://www.nihilogic.dk/labs/webgl_musical_solar_system/



Documents

CS 352: Computer Graphics Chapter 5: Viewing. Interactive Computer GraphicsChapter 5 - 2 Overview Specifying the viewpoint Specifying the projection Types