Post on 29-Dec-2015
CS 445 / 645Introduction to Computer Graphics
Lecture 3Lecture 3
Mathematical PrimitivesMathematical Primitives
Introduction to TransformationsIntroduction to Transformations
Lecture 3Lecture 3
Mathematical PrimitivesMathematical Primitives
Introduction to TransformationsIntroduction to Transformations
Show Your Gang Colors
Use hand to identify handednessUse hand to identify handedness
• Point thumb, index finger, and middle finger in orthogonal Point thumb, index finger, and middle finger in orthogonal directionsdirections
– Thumb = x-axisThumb = x-axis
– Index = y-axisIndex = y-axis
– Middle = z-axisMiddle = z-axis
• Left and right hands correspond to left and right hand Left and right hands correspond to left and right hand coordinate systemscoordinate systems
Use hand to identify handednessUse hand to identify handedness
• Point thumb, index finger, and middle finger in orthogonal Point thumb, index finger, and middle finger in orthogonal directionsdirections
– Thumb = x-axisThumb = x-axis
– Index = y-axisIndex = y-axis
– Middle = z-axisMiddle = z-axis
• Left and right hands correspond to left and right hand Left and right hands correspond to left and right hand coordinate systemscoordinate systems
Triangle Arithmetic
Consider a triangle, (a, b, c)Consider a triangle, (a, b, c)
• a,b,c = (x,y,z) tuplesa,b,c = (x,y,z) tuples
Surface area = sSurface area = saa = ½ * ||(b –a) X (c-a)|| = ½ * ||(b –a) X (c-a)||
Unit normal = (1/2sUnit normal = (1/2saa) * (b-a) X (c-a)) * (b-a) X (c-a)
Consider a triangle, (a, b, c)Consider a triangle, (a, b, c)
• a,b,c = (x,y,z) tuplesa,b,c = (x,y,z) tuples
Surface area = sSurface area = saa = ½ * ||(b –a) X (c-a)|| = ½ * ||(b –a) X (c-a)||
Unit normal = (1/2sUnit normal = (1/2saa) * (b-a) X (c-a)) * (b-a) X (c-a)
a c
b
Vector Spaces
A A linear combinationlinear combination of vectors results in a new vector: of vectors results in a new vector:
vv = = 11vv11 + + 22vv22 + … + + … + nnvvnn
If the only set of scalars such thatIf the only set of scalars such that
11vv11 + + 22vv22 + … + + … + nnvvnn = = 00
is is 11 = = 22 = … = = … = 33 = = 00
then we say the vectors are then we say the vectors are linearly independentlinearly independent
The The dimensiondimension of a space is the greatest number of linearly of a space is the greatest number of linearly independent vectors possible in a vector setindependent vectors possible in a vector set
For a vector space of dimension n, any set of n linearly For a vector space of dimension n, any set of n linearly independent vectors form a independent vectors form a basisbasis
A A linear combinationlinear combination of vectors results in a new vector: of vectors results in a new vector:
vv = = 11vv11 + + 22vv22 + … + + … + nnvvnn
If the only set of scalars such thatIf the only set of scalars such that
11vv11 + + 22vv22 + … + + … + nnvvnn = = 00
is is 11 = = 22 = … = = … = 33 = = 00
then we say the vectors are then we say the vectors are linearly independentlinearly independent
The The dimensiondimension of a space is the greatest number of linearly of a space is the greatest number of linearly independent vectors possible in a vector setindependent vectors possible in a vector set
For a vector space of dimension n, any set of n linearly For a vector space of dimension n, any set of n linearly independent vectors form a independent vectors form a basisbasis
Vector Spaces: Basis Vectors
Given a basis for a vector space:Given a basis for a vector space:
• Each vector in the space is a Each vector in the space is a uniqueunique linear combination of the basis linear combination of the basis vectorsvectors
• The The coordinatescoordinates of a vector are the scalars from this linear of a vector are the scalars from this linear combinationcombination
• If basis vectors are orthogonal and unit length:If basis vectors are orthogonal and unit length:
– Vectors comprise Vectors comprise orthonormal basisorthonormal basis
• Best-known example: Cartesian coordinatesBest-known example: Cartesian coordinates
• Note that a given vector Note that a given vector vv will have different coordinates for different will have different coordinates for different basesbases
Given a basis for a vector space:Given a basis for a vector space:
• Each vector in the space is a Each vector in the space is a uniqueunique linear combination of the basis linear combination of the basis vectorsvectors
• The The coordinatescoordinates of a vector are the scalars from this linear of a vector are the scalars from this linear combinationcombination
• If basis vectors are orthogonal and unit length:If basis vectors are orthogonal and unit length:
– Vectors comprise Vectors comprise orthonormal basisorthonormal basis
• Best-known example: Cartesian coordinatesBest-known example: Cartesian coordinates
• Note that a given vector Note that a given vector vv will have different coordinates for different will have different coordinates for different basesbases
Matrices
By convention, matrix By convention, matrix element element MMrcrc is located at is located at
row r and column c:row r and column c:
By convention, matrix By convention, matrix element element MMrcrc is located at is located at
row r and column c:row r and column c:
mnm2m1
2n2221
1n1211
MMM
MMM
MMM
M
3
2
v
v
v
v
1 By (OpenGL) By (OpenGL) convention, vectors convention, vectors are columnsare columns
By (OpenGL) By (OpenGL) convention, vectors convention, vectors are columnsare columns
Matrices
Matrix-vector multiplication applies a linear Matrix-vector multiplication applies a linear transformation to a vector:transformation to a vector:
• Why do we call this a linear transformation?Why do we call this a linear transformation?
Recall how to do matrix multiplication?Recall how to do matrix multiplication?
Matrix-vector multiplication applies a linear Matrix-vector multiplication applies a linear transformation to a vector:transformation to a vector:
• Why do we call this a linear transformation?Why do we call this a linear transformation?
Recall how to do matrix multiplication?Recall how to do matrix multiplication?
c
b
a
z
y
x
v
v
v
MMM
MMM
MMM
vM
333231
232221
131211
Matrix Transformations
A A sequencesequence or or compositioncomposition of linear transformations of linear transformations corresponds to the product of the corresponding corresponds to the product of the corresponding matricesmatrices
• Note: the matrices to the Note: the matrices to the rightright affect vector first affect vector first
• Note: order of matrices matters!Note: order of matrices matters!
The The identity matrixidentity matrix II has no effect in multiplication has no effect in multiplication
Some (not all) matrices have an inverse:Some (not all) matrices have an inverse:
A A sequencesequence or or compositioncomposition of linear transformations of linear transformations corresponds to the product of the corresponding corresponds to the product of the corresponding matricesmatrices
• Note: the matrices to the Note: the matrices to the rightright affect vector first affect vector first
• Note: order of matrices matters!Note: order of matrices matters!
The The identity matrixidentity matrix II has no effect in multiplication has no effect in multiplication
Some (not all) matrices have an inverse:Some (not all) matrices have an inverse:
vvMM 1
newold vvMMM 321
Matrix Transformations
A A linear transformationlinear transformation::
• Maps one vector to anotherMaps one vector to another
• Preserves linear combinationsPreserves linear combinations
Thus behavior of linear transformation is completely Thus behavior of linear transformation is completely determined by what it does to a basisdetermined by what it does to a basis
Turns out any linear transform can be represented by Turns out any linear transform can be represented by a a matrixmatrix
A A linear transformationlinear transformation::
• Maps one vector to anotherMaps one vector to another
• Preserves linear combinationsPreserves linear combinations
Thus behavior of linear transformation is completely Thus behavior of linear transformation is completely determined by what it does to a basisdetermined by what it does to a basis
Turns out any linear transform can be represented by Turns out any linear transform can be represented by a a matrixmatrix
Matrix Transformations
• We hypothesize that all necessary linear transformations can We hypothesize that all necessary linear transformations can be accomplished with matrix multiplicationbe accomplished with matrix multiplication
• Let’s look at a fewLet’s look at a few
– ScalingScaling
– RotationRotation
– Translation?Translation?
• We hypothesize that all necessary linear transformations can We hypothesize that all necessary linear transformations can be accomplished with matrix multiplicationbe accomplished with matrix multiplication
• Let’s look at a fewLet’s look at a few
– ScalingScaling
– RotationRotation
– Translation?Translation?
Scaling
ScalingScaling a coordinate means multiplying each of its a coordinate means multiplying each of its components by a scalarcomponents by a scalar
Uniform scalingUniform scaling means this scalar is the same for all means this scalar is the same for all components:components:
ScalingScaling a coordinate means multiplying each of its a coordinate means multiplying each of its components by a scalarcomponents by a scalar
Uniform scalingUniform scaling means this scalar is the same for all means this scalar is the same for all components:components:
2
Non-uniform scalingNon-uniform scaling: different scalars per component:: different scalars per component:
How can we represent this in matrix form?How can we represent this in matrix form?
Non-uniform scalingNon-uniform scaling: different scalars per component:: different scalars per component:
How can we represent this in matrix form?How can we represent this in matrix form?
Scaling
X 2,Y 0.5
Scaling
Scaling operation:Scaling operation:
Or, in matrix form:Or, in matrix form:
Scaling operation:Scaling operation:
Or, in matrix form:Or, in matrix form:
by
ax
y
x
'
'
y
x
b
a
y
x
0
0
'
'
scaling matrix
2-D Rotation
(x, y)
(x’, y’)
x’ = x cos() - y sin()y’ = x sin() + y cos()
2-D Rotationx = r cos ()y = r sin ()x’ = r cos ( + )y’ = r sin ( + )
Trig Identity…x’ = r cos() cos() – r sin() sin()y’ = r sin() sin() + r cos() cos()
Substitute…x’ = x cos() - y sin()y’ = x sin() + y cos()
(x, y)
(x’, y’)
2-D Rotation
This is easy to capture in matrix form:This is easy to capture in matrix form:
Even though sin(Even though sin() and cos() and cos() are nonlinear functions ) are nonlinear functions of of ,,• x’ is a linear combination of x and yx’ is a linear combination of x and y
• y’ is a linear combination of x and yy’ is a linear combination of x and y
This is easy to capture in matrix form:This is easy to capture in matrix form:
Even though sin(Even though sin() and cos() and cos() are nonlinear functions ) are nonlinear functions of of ,,• x’ is a linear combination of x and yx’ is a linear combination of x and y
• y’ is a linear combination of x and yy’ is a linear combination of x and y
y
x
y
x
cossin
sincos
'
'
Translation
What can you do with a 2x2 matrix transformation?What can you do with a 2x2 matrix transformation?
Nothing corresponds to translation…Nothing corresponds to translation…
What can you do with a 2x2 matrix transformation?What can you do with a 2x2 matrix transformation?
Nothing corresponds to translation…Nothing corresponds to translation…
'
'
y
x
y
x
dc
ba
Homogeneous Coordinates
Homogeneous coordinatesHomogeneous coordinates
• represent coordinates in 2 represent coordinates in 2 dimensions with a 3-vectordimensions with a 3-vector
Homogeneous coordinatesHomogeneous coordinates
• represent coordinates in 2 represent coordinates in 2 dimensions with a 3-vectordimensions with a 3-vector
1
coords shomogeneou y
x
y
x
Homogeneous coordinates seem unintuitive, but they Homogeneous coordinates seem unintuitive, but they make graphics operations make graphics operations muchmuch easier easier
Homogeneous coordinates seem unintuitive, but they Homogeneous coordinates seem unintuitive, but they make graphics operations make graphics operations muchmuch easier easier
Homogeneous Coordinates
Our transformation matrices are now 3x3:Our transformation matrices are now 3x3:Our transformation matrices are now 3x3:Our transformation matrices are now 3x3:
100
0)cos()sin(
0)sin()cos(
otationR
100
00
00
b
a
Scale
Homogeneous Coordinates
Q: How can we represent translation as a 3x3 matrix?Q: How can we represent translation as a 3x3 matrix?
A: Using the rightmost column:A: Using the rightmost column:
Q: How can we represent translation as a 3x3 matrix?Q: How can we represent translation as a 3x3 matrix?
A: Using the rightmost column:A: Using the rightmost column:
100
10
01
y
x
T
T
ranslationT
Translation
Example of translationExample of translationExample of translationExample of translation
11100
10
01
y
x
y
x
Ty
Tx
y
x
T
T
Tx = 2Ty = 1
Total Picture
Think about what happens with Think about what happens with manipulating transformation manipulating transformation matrixmatrix
• a, e = negative?a, e = negative?
• Changing d and e?Changing d and e?
• Changing i != 1?Changing i != 1?
Think about what happens with Think about what happens with manipulating transformation manipulating transformation matrixmatrix
• a, e = negative?a, e = negative?
• Changing d and e?Changing d and e?
• Changing i != 1?Changing i != 1?
ihg
fed
cba
Composing Transformations
What if we want to scale What if we want to scale andand rotate rotate andand translate? translate?
• We can execute transformations one after the otherWe can execute transformations one after the other
• Ex: Ex: Rotate line segment by 45 degrees about endpoint Rotate line segment by 45 degrees about endpoint aa
What if we want to scale What if we want to scale andand rotate rotate andand translate? translate?
• We can execute transformations one after the otherWe can execute transformations one after the other
• Ex: Ex: Rotate line segment by 45 degrees about endpoint Rotate line segment by 45 degrees about endpoint aa
a a
Multiplication Order – Wrong Way
Our line is defined by two endpointsOur line is defined by two endpoints
• Applying a rotation of 45 degrees, R(45), affects both pointsApplying a rotation of 45 degrees, R(45), affects both points
• We could try to translate both endpoints to return endpoint We could try to translate both endpoints to return endpoint aa to its to its original position, but by how much?original position, but by how much?
Our line is defined by two endpointsOur line is defined by two endpoints
• Applying a rotation of 45 degrees, R(45), affects both pointsApplying a rotation of 45 degrees, R(45), affects both points
• We could try to translate both endpoints to return endpoint We could try to translate both endpoints to return endpoint aa to its to its original position, but by how much?original position, but by how much?
T(-3), R(45), T(3)
Wrong CorrectT(-3) R(45) T(3)R(45)
aa
Multuplication Order - Correct
Isolate endpoint Isolate endpoint aa from rotation effects from rotation effects
• First translate line so First translate line so aa is at origin: T (-3) is at origin: T (-3)
• Then rotate line 45 degrees: R(45)Then rotate line 45 degrees: R(45)
• Then translate back so Then translate back so aa is where it was: T(3) is where it was: T(3)
Isolate endpoint Isolate endpoint aa from rotation effects from rotation effects
• First translate line so First translate line so aa is at origin: T (-3) is at origin: T (-3)
• Then rotate line 45 degrees: R(45)Then rotate line 45 degrees: R(45)
• Then translate back so Then translate back so aa is where it was: T(3) is where it was: T(3)
a
a
a
a
Will this sequence of operations work?Will this sequence of operations work?
Result of first multiply with vectorResult of first multiply with vector
Will this sequence of operations work?Will this sequence of operations work?
Result of first multiply with vectorResult of first multiply with vector
Compositing Matrices
1
'
'
1100
010
301
100
0)45cos()45sin(
0)45sin()45cos(
100
010
301
y
x
y
x
a
a
a
a
1
3
1100
010
301
y
x
y
x
a
a
a
a
Compositing Matrices
Order of multiplication mattersOrder of multiplication matters
Short answer: the transformations, in order, are Short answer: the transformations, in order, are written from written from rightright to to leftleft
• In other words, the first matrix to affect the vector goes next In other words, the first matrix to affect the vector goes next to the vector, the second next to the first, etc.to the vector, the second next to the first, etc.
Order of multiplication mattersOrder of multiplication matters
Short answer: the transformations, in order, are Short answer: the transformations, in order, are written from written from rightright to to leftleft
• In other words, the first matrix to affect the vector goes next In other words, the first matrix to affect the vector goes next to the vector, the second next to the first, etc.to the vector, the second next to the first, etc.
Compositing Matrices
After correctly ordering the matricesAfter correctly ordering the matrices
Multiply matrices togetherMultiply matrices together
What results is one matrix – What results is one matrix – store it!store it!
Multiply this matrix by the vector of each vertexMultiply this matrix by the vector of each vertex
All vertices easily trasformed with one matrix All vertices easily trasformed with one matrix multiplymultiply
After correctly ordering the matricesAfter correctly ordering the matrices
Multiply matrices togetherMultiply matrices together
What results is one matrix – What results is one matrix – store it!store it!
Multiply this matrix by the vector of each vertexMultiply this matrix by the vector of each vertex
All vertices easily trasformed with one matrix All vertices easily trasformed with one matrix multiplymultiply
Frame Buffers
A frame buffer may be thought of as computer A frame buffer may be thought of as computer memory organized as a two-dimensional array memory organized as a two-dimensional array with each (x,y) addressable location with each (x,y) addressable location corresponding to one pixel.corresponding to one pixel.
Bit PlaneBit Planes or s or Bit DepthBit Depth is the number of bits is the number of bits corresponding to each pixel.corresponding to each pixel.
A typical frame buffer resolution might beA typical frame buffer resolution might be
640 x 480 x 8640 x 480 x 81280 x 1024 x 81280 x 1024 x 81280 x 1024 x 241280 x 1024 x 24
1-Bit Memory, Monochrome Display (Bitmap Display)
Electron Gun
1 bit 2 levels
3-Bit Color Display
3
red
green
blue
COLOR: black red green blue yellow cyan magenta white
R G B
0 0 0
1 0 0
0 1 0
0 0 1
1 1 0
0 1 1
1 0 1
1 1 1
True Color Display
Green
Red
Blue
8
8
8
24 bitplanes, 8 bits per color gun.224 = 16,777,216
Color Map Look-Up Tables
Extends the number of colors that can be displayed by a Extends the number of colors that can be displayed by a given number of bit-planes.given number of bit-planes.
67
100110100001
0
67
255
1001 1010 0001
R G B
RED
GREEN
BLUE
Pixel displayedat x', y'
Pixel inbit mapat x', y'
0 x0
y
xmax
maxy
Frame buffer Look-up table Display
Pseudo color
0
1
2
3
254
255
RED GREEN BLUE
256 colors chosen from a palette of 16,777,216.
Each entry in the color map LUT can be user defined.
28 x 24 Color Map LUT
Rendering 3D Scenes
Transform
Illuminate
Transform
Clip
Project
Rasterize
Model & CameraModel & CameraParametersParameters Rendering PipelineRendering Pipeline FramebufferFramebuffer DisplayDisplay
The Rendering Pipeline
Transform
Illuminate
Transform
Clip
Project
Rasterize
Model & CameraModel & CameraParametersParameters Rendering PipelineRendering Pipeline FramebufferFramebuffer DisplayDisplay
Rendering: Transformations
We’ve learned about transformationsWe’ve learned about transformations
But they are used in three ways:But they are used in three ways:
• Modeling transformsModeling transforms
• Viewing transforms (Move the camera)Viewing transforms (Move the camera)
• Projection transforms (Change the type of camera)Projection transforms (Change the type of camera)
We’ve learned about transformationsWe’ve learned about transformations
But they are used in three ways:But they are used in three ways:
• Modeling transformsModeling transforms
• Viewing transforms (Move the camera)Viewing transforms (Move the camera)
• Projection transforms (Change the type of camera)Projection transforms (Change the type of camera)
The Rendering Pipeline: 3-D
Result:Result:
• All vertices of scene in shared 3-D “world” coordinate systemAll vertices of scene in shared 3-D “world” coordinate system
• Vertices shaded according to lighting modelVertices shaded according to lighting model
• Scene vertices in 3-D “view” or “camera” coordinate systemScene vertices in 3-D “view” or “camera” coordinate system
• Exactly those vertices & portions of polygons in view frustumExactly those vertices & portions of polygons in view frustum
• 2-D screen coordinates of clipped vertices2-D screen coordinates of clipped vertices
Scene graphObject geometry
LightingCalculations
Clipping
ModelingTransforms
ViewingTransform
ProjectionTransform
The Rendering Pipeline: 3-D
ModelingTransforms
Scene graphObject geometry
LightingCalculations
ViewingTransform
Clipping
ProjectionTransform
Result:Result:
• All vertices of scene in shared 3-D “world” coordinate systemAll vertices of scene in shared 3-D “world” coordinate system
Rendering: Transformations
Modeling transformsModeling transforms
• Size, place, scale, and rotate objects and parts of the Size, place, scale, and rotate objects and parts of the model w.r.t. each othermodel w.r.t. each other
• Object coordinates -> world coordinatesObject coordinates -> world coordinates
Modeling transformsModeling transforms
• Size, place, scale, and rotate objects and parts of the Size, place, scale, and rotate objects and parts of the model w.r.t. each othermodel w.r.t. each other
• Object coordinates -> world coordinatesObject coordinates -> world coordinates
Z
X
Y
X
Z
Y
ModelingTransforms
Scene graphObject geometry
LightingCalculations
ViewingTransform
Clipping
ProjectionTransform
Result:Result:
• Scene vertices in 3-D “view” or “camera” coordinate systemScene vertices in 3-D “view” or “camera” coordinate system
The Rendering Pipeline: 3-D
Rendering: Transformations
Viewing transformViewing transform
• Rotate & translate the world to lie directly in front of Rotate & translate the world to lie directly in front of the camerathe camera
– Typically place camera at originTypically place camera at origin
– Typically looking down -Z axisTypically looking down -Z axis
• World coordinatesWorld coordinates view coordinatesview coordinates
Viewing transformViewing transform
• Rotate & translate the world to lie directly in front of Rotate & translate the world to lie directly in front of the camerathe camera
– Typically place camera at originTypically place camera at origin
– Typically looking down -Z axisTypically looking down -Z axis
• World coordinatesWorld coordinates view coordinatesview coordinates
ModelingTransforms
Scene graphObject geometry
LightingCalculations
ViewingTransform
Clipping
ProjectionTransform
Result:Result:
• 2-D screen coordinates of clipped vertices2-D screen coordinates of clipped vertices
The Rendering Pipeline: 3-D
Rendering: Transformations
Projection transformProjection transform
• Apply perspective foreshorteningApply perspective foreshortening
– Distant = small: the Distant = small: the pinhole camerapinhole camera model model
• View coordinates View coordinates screen coordinates screen coordinates
Projection transformProjection transform
• Apply perspective foreshorteningApply perspective foreshortening
– Distant = small: the Distant = small: the pinhole camerapinhole camera model model
• View coordinates View coordinates screen coordinates screen coordinates
Perspective CameraPerspective Camera
Orthographic CameraOrthographic Camera
Perspective CameraPerspective Camera
Orthographic CameraOrthographic Camera
Rendering: Transformations
Introducing OpenGL
mid-level, device-independent, portable graphics mid-level, device-independent, portable graphics subroutine packagesubroutine package
developed primarily by SGIdeveloped primarily by SGI
2D/3D graphics, lower-level primitives (polygons)2D/3D graphics, lower-level primitives (polygons)
does not include low-level I/O managementdoes not include low-level I/O management
basis for higher-level libraries/toolkitsbasis for higher-level libraries/toolkits
mid-level, device-independent, portable graphics mid-level, device-independent, portable graphics subroutine packagesubroutine package
developed primarily by SGIdeveloped primarily by SGI
2D/3D graphics, lower-level primitives (polygons)2D/3D graphics, lower-level primitives (polygons)
does not include low-level I/O managementdoes not include low-level I/O management
basis for higher-level libraries/toolkitsbasis for higher-level libraries/toolkits
Introducing OpenGL
Recall the rendering pipeline:Recall the rendering pipeline:• Transform geometry (object Transform geometry (object world, world world, world eye)eye)
• Apply perspective projection (eye Apply perspective projection (eye screen)screen)
• Clip to the view frustumClip to the view frustum
• Perform visible-surface processing (Z-buffer)Perform visible-surface processing (Z-buffer)
• Calculate surface lightingCalculate surface lighting
Implementing all this is a lot of work Implementing all this is a lot of work
OpenGLOpenGL provides a standard implementation provides a standard implementation • So why study the basics?So why study the basics?
Recall the rendering pipeline:Recall the rendering pipeline:• Transform geometry (object Transform geometry (object world, world world, world eye)eye)
• Apply perspective projection (eye Apply perspective projection (eye screen)screen)
• Clip to the view frustumClip to the view frustum
• Perform visible-surface processing (Z-buffer)Perform visible-surface processing (Z-buffer)
• Calculate surface lightingCalculate surface lighting
Implementing all this is a lot of work Implementing all this is a lot of work
OpenGLOpenGL provides a standard implementation provides a standard implementation • So why study the basics?So why study the basics?