© Machiraju/Zhang/Möller
3D Viewing
Introduction to Computer GraphicsTorsten Möller
© Machiraju/Zhang/Möller 2
Reading• Chapter 4 of Angel• Chapter 13 of Hughes, van Dam, …• Chapter 7 of Shirley+Marschner
© Machiraju/Zhang/Möller
Objectives• What kind of camera we use? (pinhole)• What projections make sense
– Orthographic– Perspective
• The viewing pipeline• Viewing in WebGL• Shadows
3
© Machiraju/Zhang/Möller 4
3D Viewing• Popular analogy: virtual camera taking
pictures in a virtual world• The process of getting an image onto the
computer screen is like that of taking a snapshot.
© Machiraju/Zhang/Möller 5
3D Viewing (2)• With a camera, one:
– establishes the view – opens the shutter and exposes the film
© Machiraju/Zhang/Möller 6
3D Viewing (3)• With a camera, one:
– establishes the view – opens the shutter and exposes the film
• With a computer, one: – chooses a projection type (not necessarily
perspective) – establishes the view – clips the scene according to the view – projects the scene onto the computer display
© Machiraju/Zhang/Möller 7
The ideal pinhole camera• Single ray of light gets through small pinhole• Film placed on side of box opposite to
pinhole
Projection
© Machiraju/Zhang/Möller 8
The pinhole camera• Angle of view (always fixed)
• Depth of field (DOF): infinite – every point within the field of view is in focus (the image of a point is a point)
• Problem: just a single ray of light & fixed view angle
• Solution: pinhole → lens, DOF no longer infinite
© Machiraju/Zhang/Möller 9http://en.wikipedia.org/wiki/File:DOF-ShallowDepthofField.jpg
© Machiraju/Zhang/Möller 10
The synthetic camera model• Image formed in front of the camera• Center of projection (COP):
center of the lens (eye)
© Machiraju/Zhang/Möller 11
Types of projections• Choose an appropriate type of projection
(not necessarily perspective) • Establishes the view: direction and
orientation
© Machiraju/Zhang/Möller 12
3D viewing with a computer• Clips scene with respect to a view volume
– Usually finite to avoid extraneous objects• Projects the scene onto a projection plane
– In a similar way as for the synthetic camera model
– Everything in view volume is in focus– Depth-of-field (blurring) effects may be generated
© Machiraju/Zhang/Möller 13
Project onto projection plane
Clip against 3D view volume
Where are we at?
© Machiraju/Zhang/Möller
Objectives• What kind of camera we use? (pinhole)• What projections make sense
– Orthographic– Perspective
• The viewing pipeline• Viewing in WebGL• Shadows
14
© Machiraju/Zhang/Möller 15
Projection: 3D → 2D• We study planar geometric projections:
– projecting onto a flat 2D surface – project using straight lines
• Projection rays, called projectors, are sent through each point in the scene from the centre of projection (COP) - our pinhole
• Intersection between projectors and projection plane form the projection
© Machiraju/Zhang/Möller 16
Perspective and parallel projections
• Parallel:– COP at infinity– By direction of
projectors (DOP)
• Perspective:- Determined by COP
© Machiraju/Zhang/Möller 17
COP in homogeneous coordinates
• Perspective projection: COP is a– finite point: (x, y, z, 1)
• Parallel projection– Direction of projection is a vector:
(x, y, z, 1) – (x’, y’, z’, 1) = (a, b, c, 0)– Points at infinity and directions correspond in a
natural way
© Machiraju/Zhang/Möller 18
Perspective vs. parallel• Perspective projection:
– Realistic, mimicking our human visual system– Foreshortening: size of perspective projection of
object varies inversely with the distance of that object from the center of projection
– Distances, angles, parallel lines are not preserved• Parallel projection:
– Less realistic but can be used for measurements– Foreshortening uniform, i.e., not related to distance– Parallel lines are preserved (length preserving?)
© Machiraju/Zhang/Möller 19
© Machiraju/Zhang/Möller 20
Taxonomy of projectionsAngle between projectors and projection plane?
Number of principal axes cut by projection plane
© Machiraju/Zhang/Möller 21
Parallel projections• Used in engineering mostly, e.g., architecture• Allow measurements• Different uniform foreshortenings are
possible, i.e., not related to distance to projection plane
• Parallel lines remain parallel• Angles are preserved only on faces which
are parallel to the projection plane – same with perspective projection
© Machiraju/Zhang/Möller 22
Orthographic (parallel) projections
• Projectors are normal to the projection plane• Commonly front, top (plan) and side
elevations: projection plane perpendicular to z, y, and x axis
• Matrix representation (looking towards negative z along the z axis; projection plane at z = 0):
© Machiraju/Zhang/Möller 23
Orthographic projections• Axonometric projection
– Projection plane not normal to any principal axis– E.g., can see more faces of an axis-aligned
cube
© Machiraju/Zhang/Möller 24
Orthographic projections• Foreshortening: three
scale factors, one each for x, y, and z axis
• Axonometric projectionexample:
© Machiraju/Zhang/Möller 25
Orthographic projection• Axonometric projection – Isometric
– Projection-plane normal makes same angle with each principal axis
– There are just eight normal directions of this kind– All three principal axes are equally
foreshortened, good for getting measurements– Principal axes make same angle in projection
plane• Alternative: dimetric & trimetric (general
case)
© Machiraju/Zhang/Möller 26
Parallel Projection (4)• Axonometric Projection - Isometric
– Angles between the projection of the axes are equal i.e. 120º
• Alternative- dimetric & trimetric
© Machiraju/Zhang/Möller
Types of Axonometric Projections
27
© Machiraju/Zhang/Möller 28
Oblique (parallel) projections• Projectors are not normal to projection
plane
• Most drawings in the text use oblique projection
© Machiraju/Zhang/Möller 29
Oblique projections• Two angles are of interest:
– Angle α between the projector and projection plane
– The angle φ in the projection plane
• Derive the projection matrix
© Machiraju/Zhang/Möller 30
Derivation of oblique projections
© Machiraju/Zhang/Möller 31
Common oblique projections• Cavalier projections
– Angle α = 45 degrees– Preserves the length of a line segment
perpendicular to the projection plane– Angle φ is typically 30 or 45 degrees
• Cabinet projections– Angle α = 63.7 degrees or arctan(2)– Halves the length of a line segment
perpendicular to the projection plane – more realistic than cavalier
© Machiraju/Zhang/Möller 32
Projections, continued
© Machiraju/Zhang/Möller 33
Perspective projections• Mimics our human visual
system or a camera• Project in front of the center
of projection• Objects of equal size at different distances
from the viewer will be projected at different sizes: nearer objects will appear bigger
© Machiraju/Zhang/Möller 34
Types of perspective projections
• Any set of parallel lines that are not parallel to the projection plane converges to a vanishing point, which corresponds to point at infinity in 3D
• One-, two-, three-point perspective views are based on how many principal axes are cut by projection plane
© Machiraju/Zhang/Möller 35
Vanishing points
© Machiraju/Zhang/Möller
• COP at z = 0• Projection plane at z = d
• Transformation is not invertible or affine. Derive the projection matrix.
36
Simple perspective projection
© Machiraju/Zhang/Möller 37
Simple perspective projection• How to get a perspective projection matrix?• Homogeneous coordinates come to the
rescue
© Machiraju/Zhang/Möller 38
Summary of simple projections• COP: origin of the coordinate system• Look into positive z direction• Projection plane perpendicular to z axis
© Machiraju/Zhang/Möller
Objectives• What kind of camera we use? (pinhole)• What projections make sense
– Orthographic– Perspective
• The viewing pipeline• Viewing in WebGL• Shadows
39
© Machiraju/Zhang/Möller 40
General viewing and projections
• With scene specified in world coordinate system
• Position and orientation of camera• Projection: perspective or parallel
– Clip objects against a view volume – which one?
– Normalize the view volume (easier to do this way)
– The rest is orthographic projection
© Machiraju/Zhang/Möller 41
Perspective Projections• Need to describe the viewing
– VRP - view reference point
VRP
© Machiraju/Zhang/Möller 42
Perspective Projections• Need to describe the viewing
– VRP - view reference point– VN - view normal
VRP
VN
© Machiraju/Zhang/Möller 43
Perspective Projections• Need to describe the viewing
– VRP - view reference point– VN - view normal– VUP - up vector
VRPu
v
VUP
VN
© Machiraju/Zhang/Möller 44
Perspective Projections• Need to describe the viewing
– VRP - view reference point– VN - view normal– VUP - up vector– COP - centre of projection
VRPu
v
VUP
VN
COP
© Machiraju/Zhang/Möller 45
Clipping• Projection defines a view volume• add front and back clipping plane • make view volume finite• why is this useful for a perspective
projection?
© Machiraju/Zhang/Möller 46
Clipping (2)• How should we clip a scene against the
view volume? • We could clip against the actual
coordinates, but is there an easier way?
© Machiraju/Zhang/Möller 47
Clipping (3)• Canonical view volume
– Parallel:x = -1, x = 1, y = -1, y = 1, z = 0, z = -1
– Perspective:x = z, x = -z, y = z, y = -z, z = -z_min, z = -1
© Machiraju/Zhang/Möller 48
Viewing Process
© Machiraju/Zhang/Möller 49
Normalization - Parallel• translate the
VRP to the origin
© Machiraju/Zhang/Möller 50
Normalization - Parallel (2)• rotate the view
referencecoordinates suchthat the VPNbecomes the z axis,u becomes the xaxis and vbecomes the yaxis
© Machiraju/Zhang/Möller 51
Normalization - Parallel (3)• shear so that the
direction ofprojection isparallel to thez axis
© Machiraju/Zhang/Möller 52
Normalization - Parallel (4)• translate and
scale into thecanonical viewvolume
© Machiraju/Zhang/Möller 53
Normalization - Parallel (5)• translates the VRP to the origin• rotate the view reference coordinates such
that the VPN becomes the z axis, u becomes the x axis and v becomes the y axis
• shear so that the direction of projection is parallel to the z axis
• translate and scale into the canonical view volume
© Machiraju/Zhang/Möller 54
Normalization - Parallel (6)• Projection matrix:
M = S � T � SH �R� T
© Machiraju/Zhang/Möller 55
Normalization - Perspective• translates the VRP
to the origin
© Machiraju/Zhang/Möller 56
Normalization - Perspective (2)• rotate the view
reference coordinatessuch that the VPNbecomes the zaxis, u becomesthe x axis and vbecomes they axis.
© Machiraju/Zhang/Möller 57
Normalization - Perspective (3)• Translate
so that thecenter of projectionis at the origin
© Machiraju/Zhang/Möller 58
Normalization - Perspective (4)• shear so
that the centreline of the viewvolume becomesthe z axis
© Machiraju/Zhang/Möller 59
Normalization - Perspective (5)• scale into
the canonicalview volume
© Machiraju/Zhang/Möller 60
Normalization - Perspective (6)• translates the VRP to the origin • rotate the view reference coordinates such
that the VPN becomes the z axis, u becomes the x axis and v becomes the y axis.
• translate so that the center of projection is at the origin
• shear so that the centre line of the view volume becomes the z axis
• scale into the canonical view volume
© Machiraju/Zhang/Möller
• Projection matrix (perspective):
• Projection matrix (parallel):
61
Normalization - Perspective (7)
M = Ppers � S � SH � T �R� T
M = Pparall � S � SH �R� T
© Machiraju/Zhang/Möller
Objectives• What kind of camera we use? (pinhole)• What projections make sense
– Orthographic– Perspective
• The viewing pipeline• Viewing in WebGL• Shadows
62
©Angel/Shreiner/Möller
Computer Viewing• There are three aspects of the viewing
process, all of which are implemented in a pipeline,– Positioning the camera
• Setting the model-view matrix– Selecting a “lens”
• Setting the projection matrix– Clipping
• Setting the view volume
63
©Angel/Shreiner/Möller
The WebGL Camera• In WebGL, initially the object and camera
frames are the same– Default model-view matrix is an identity
• The camera is located at origin and points in the negative z direction
• WebGL also specifies a default view volume that is a cube with sides of length 2 centered at the origin– Default projection matrix is an identity
64
©Angel/Shreiner/Möller
Default Projection• Default projection is orthogonal
65
clipped out
z=0
2
©Angel/Shreiner/Möller
Moving the Camera Frame• If we want to visualize an object with both
positive and negative z values we can either– Move the camera in the positive z direction
• Translate the camera frame– Move the objects in the negative z direction
• Translate the world frame• Both of these views are equivalent and are
determined by the model-view matrix– Want a translation Translate(0.0,0.0,-d);– d > 0
66
©Angel/Shreiner/Möller
Moving the Camera• We can move the camera to any desired
position by a sequence of rotations and translations
• Example: side view– Rotate the camera– Move it away from origin– Model-view matrix C = TR
67
©Angel/Shreiner/Möller
The LookAt Function• The GLU library contained the function
gluLookAt to form the required modelview matrix through a simple interface
• Note the need for setting an up direction• Replaced by LookAt() in mat.h
– Can concatenate with modeling transformations• Example: isometric view of cube aligned
with axesmat4 mv = LookAt(vec4 eye, vec4 at, vec4 up);
68
©Angel/Shreiner/Möller
gluLookAt• LookAt(eye, at, up)
69
©Angel/Shreiner/Möller
Other Viewing APIs• The LookAt function is only one possible
API for positioning the camera• Others include
– View reference point, view plane normal, view up (PHIGS, GKS-3D)
– Yaw, pitch, roll– Elevation, azimuth, twist– Direction angles
70
©Angel/Shreiner/Möller
WebGL Orthogonal ViewingOrtho(left,right,bottom,top,near,far)
near and far measured from camera
71
©Angel/Shreiner/Möller
WebGL PerspectiveFrustum(left,right,bottom,top,near,far)
72
©Angel/Shreiner/Möller
Using Field of View• With Frustum it is often difficult to get the
desired viewPerpective(fovy,aspect,near,far) often provides a better interface
aspect = w/h
front plane
73
© Machiraju/Zhang/Möller
Objectives• What kind of camera we use? (pinhole)• What projections make sense
– Orthographic– Perspective
• The viewing pipeline• Viewing in WebGL• Shadows
74
© Machiraju/Zhang/Möller 75
Application of projection: shadows
• Essential component for realistic rendering• Naturally use projections
– Can produce hard shadows– Only handles shadows on a plane– To shadow on a polygonal face, need clipping
• More advanced shadow algorithms exist, e.g., soft shadows and penumbra (not easy to do)
• Blinn 74
© Machiraju/Zhang/Möller 76
Shadow via projection• A shadow polygon is obtained through
projection where the center of projection is a light source
© Machiraju/Zhang/Möller 77
Shadow polygon: parallel projection
(xp, yp, zp)
(xs, ys, 0)
• Project shadow on z = 0• Light at ∝ (directional light)• Derive the projection matrix
© Machiraju/Zhang/Möller
• Light at infinity:
• hence projection:
78
Shadows: parallel projection
Now draw the objecton the ground plane
© Machiraju/Zhang/Möller
• Project on plane z = 0• Point light source • Derive the matrix
79
Shadows: perspective projection
© Machiraju/Zhang/Möller
• Local Light:
• projection matrix:
80
Shadows: perspective projection
© Machiraju/Zhang/Möller 81
Shadow of a teapot
© Machiraju/Zhang/Möller 82
Shadows• requires no extra memory• easily handles any number of light sources• only shadows onto ground plane• cannot handle objects which shadow other
complex objects• every polygon is rendered N+1 times, where
N is number of light sources
Top Related