CS 352: Computer Graphics - PowerPoint Presentation

Slide1

CS 352: Computer Graphics

Chapter 5:

Viewing

Slide2

Interactive Computer Graphics

Chapter 5 - 2Overview

Specifying the viewpoint

Specifying the projection

Types of projections

Viewing APIs

Walking through a scene

Projections and shadows

Slide3

How do cameras work?Interactive Computer Graphics

Chapter 5 - 3

Slide4

Synthentic camera model1. 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)?

Interactive Computer Graphics

Chapter 5 -

4

Slide5

Synthetic camera parametersPosition 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

Interactive Computer Graphics

Chapter 5 -

5

Slide6

Interactive Computer Graphics

Chapter 5 -

6

Slide7

Perspective distortionHow would you film dizziness?

Vertigo effect [2]Interactive Computer Graphics

Chapter 5 -

7

Slide8

Interactive Computer Graphics

Chapter 5 - 8Projections

Basic Elements:

Objects, viewer

Projection plane

Projectors

Center of projection

Direction of

projection (DOP)

Basic Types

Perspective

Parallel (COP

at infinity)

Slide9

Interactive Computer Graphics

Chapter 5 - 9Classical viewing

Slide10

Interactive Computer Graphics

Chapter 5 - 10Orthographic projection

Orthographic

: parallel projection with projectors

perpendicular to the

projection plane.

Often used as front,

side, top views for 3D

design

Importance: preservation

of distance and angle

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

Slide11

Interactive Computer Graphics

Chapter 5 - 11Perspective 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)

Slide12

Interactive Computer Graphics

Chapter 5 - 121. 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

= identity

translate(0,0,-d)

rotate(-45,<0,1,0>);

Slide13

Interactive Computer Graphics

Chapter 5 - 13Exercise: 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]);

Slide14

Interactive Computer Graphics

Chapter 5 - 14Exercise: 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]);

Slide15

Interactive Computer Graphics

Chapter 5 - 15Helper function: lookAt

Most 3D toolkits let you position the camera by setting

eyepoint

,

lookpoint

,

and

up

direction

lookAt(X

eye

,

Y

eye

,

Z

eye

,

X

at

,

Y

at

,

Z

at

,

X

up

, Y

up

, Zup):

Effect: set the

modelview

matrix

Slide16

Rolling your own lookAt

How could you write your own lookAt function?lookAt(X

eye

,

Y

eye

,

Z

eye

,

X

at

,

Y

at

,

Z

at

,

Xup, Y

up

,

Z

up

):

Interactive Computer Graphics

Chapter 5 -

16

Slide17

Defining a lookAt function

lookAt(Xeye, Yeye

,

Z

eye

,

X

at

,

Y

at

,

Z

at

,

X

up

, Y

up

, Z

up

):

translate <

X

at

,

Y

at

,

Z

at

> to origin

rotate so that <

Xeye, Yeye

,

Z

eye

>

points in the Z direction

normalize <

X

eye

,

Y

eye

,

Z

eye

>

trackball-like rotation to <0,0,1>

rotate so <

X

up

, Y

up

,

Z

up

> is <0,1,0>

trackball-like rotation

Interactive Computer Graphics

Chapter 5 -

17

Slide18

Interactive Computer Graphics

Chapter 5 - 18Camera 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

Slide19

Interactive Computer Graphics

Chapter 5 - 19Camera API 3: roll, pitch, yaw

Specify location + orientation:

roll

,

pitch

,

yaw

Slide20

2. Specify projectionInteractive Computer Graphics

Chapter 5 - 20

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

Slide21

Parallel projectionWe’re already looking along the –z axis

Set z=0 for all points (or ignore z coordinate when rendering)Interactive Computer Graphics

Chapter 5 -

21

Slide22

Interactive Computer Graphics

Chapter 5 - 22Parallel 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

Slide23

Perspective projectionNeed to build appropriate perspective projection matrix into

vertex shaderWhat kind of transformation would this be?

Interactive Computer Graphics

Chapter 5 -

23

Slide24

Interactive Computer Graphics

Chapter 5 - 24Perspective projections

COP at origin

Looking in –

z

direction

Projection plane in front of origin at

z

=

d

Slide25

Interactive Computer Graphics

Chapter 5 - 25Foreshortening

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.

Slide26

Perspective FrustumPerspective viewing region is a “frustum”:

Viewplane normally coincides

with front clip plane

Interactive Computer Graphics

Chapter 5 -

26

Slide27

Interactive Computer Graphics

Chapter 5 - 27Camera 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)

Slide28

Perspective projection3D graphics toolkits provide tools for specifying a perspective projection, e.g.

Interactive Computer Graphics

Chapter 5 -

28

Slide29

Interactive Computer Graphics

Chapter 5 - 29Shadows

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”. How to use a projection?

Slide30

Interactive Computer Graphics

Chapter 5 - 30Projections and shadows

Projections can be used to generate simple shadow polygons

Light (x

l

, y

l

, z

l

)

Translate light to origin

Project down y axis [M]

Translate back

Slide31

Interactive Computer Graphics

Chapter 5 - 31Simple Shadow in OpenGL

GLfloat

m[16]; //projection matrix

for (

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 state

glTranslatef

(xl,

yl

,

zl

);

glMultMatrix

(m);

glTranslatef

(-xl, -

yl

, -

zl

);

glColor3fv(

shadow_color

);

[draw polygon]

glEnd

();

glPopMatrix

();

Slide32

Interactive Computer Graphics

Chapter 5 - 32Walking 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);

Or adjust

LookAt

according to mouse position

Slide33

Credits1. (Pinhole camera): Wikipedia.

5. Synthetic camera parameters: Liz Marai, PittDemosMusical solar system

Interactive Computer Graphics

Chapter 5 -

33

Slide34

Interactive Computer Graphics

Chapter 5 -

34

Slide35

Interactive Computer Graphics

Chapter 5 -

35