Geometric Transformations: 2D and 3D

CS123 | INTRODUCTION TO COMPUTER GRAPHICS
Andries van Dam

Geometric Transformations
2D and 3D
1/44
Tuesday 10/4/2011
Andries van Dam
Objects in a scene are a collection of points

These objects have location, orientation, size
Corresponds to transformations, Translation (), Rotation (), and
Scaling ()

2/44
How do we use Geometric Transformations? (1/2)
Andries van Dam
A scene has a camera/view point from which the scene is viewed
The camera has some orientation and some location

These correspond to Rotation and Translation
Other types of viewing transformations need to be made as well that we
will learn about shortly
3/44
How do we use Geometric Transformations? (2/2)
Andries van Dam
3D Coordinate geometry
Vectors in 2 space and 3 space
Dot product and cross product definitions and uses
Vector and matrix notation and algebra
Identity Matrix
Multiplicative associativity
E.g. A(BC) = (AB)C
Matrix transpose and inverse definition, use, and calculation
Homogeneous coordinates (, , , )

You will need to understand these concepts!
Linear Algebra Help Session Notes:
http://cs.brown.edu/courses/cs123/resources/Linear_Algebra.pdf

4/44
Some Linear Algebra Concepts...
Andries van Dam
We represent vectors as bold-italic letters () and scalars as just
italicized letters (c)
Any vector in plane can be defined
as addition of two non-colinear basis
vectors in the plane
Scalar constants can be used to adjust
magnitude and direction of
resultant vector
Definition of a linear function, f:
f + = f + f() where domain and co-domain of f are
identical
function of a vector addition is equivalent to addition of function applied
to each of the vectors
f = f
function of a scalar multiplication with a vector is scalar multiplied by
function applied to vector
5/44
Linear Transformations (1/2)
a
b
= a + b
Andries van Dam
Graphical Use: Transformations of points around the origin
(leaves the origin invariant)
These include Scaling and Rotations (but not translation),
Translation is not a linear function
Any linear transformation of a point will result in another point in the
same coordinate system, transformed about the origin

6/44
Linear Transformations (2/2)
Andries van Dam
Linear Transformations can be represented as non-singular (invertible)
matrices
Lets start with 2D transformations:
=

The matrix can also be written as:

1 2

, where 1 =
, 2 =

Where 1 and 2 are the standard unit basis vectors along the x and y vectors:
1 =
1
0
, 2 =
0
1

Why is this important? This means we can compute the columns of a
transformation matrix one by one by determining how our transformation
effects each of the standard unit vectors. Thus sends 1 to =

From this we can derive our transformation matrices

7/44
Linear Transformations as Matrices (1/2)
Andries van Dam
A transformation of an arbitrary column vector
has form:

Lets substitute
1
0
for

:
1
0
=

1
0
=

transformation applied to
1
0
is 1
st
column of

Now substitute
0
1
for

:
0
1
=

0
1
=

transformation applied to
0
1
is 2
nd
column of
8/44
Linear Transformations as Matrices (2/2)
Andries van Dam
Scale by 3, by 2
=
(original vertex)
=
(new vertex)
=

where
Derive by determining how 1 and 2 should be transformed
1 =
1
0

* 1 =
0
(Scale in X by
) , the first column of

2 =
0
1

* 2 =
0
(Scale in Y by
), the second column of

Thus we obtain :
0
0

9/44
Scaling in 2D (1/2)
2
3
=
=
y
x
s
s
Side effect:
House shifts
position relative
to origin
(
1
2
(
1
3
(
2
6
(
2
9
Andries van Dam
is a diagonal matrix - can confirm our derivation by simply looking at
properties of diagonal matrices:
=
0
0

= , where is some diagonal matrix

entry of = (
entry along diagonal of
entry of )
multiplies each coordinate of a by scaling factors (
) specified
by the entries along the diagonal, as expected

= ,
=
Other properties of scaling:
does not preserve lengths in objects
does not preserve angles between parts of objects (except when scaling is
uniform,
)
if not at origin, translates house relative to origin often not desired

10/44
Scaling in 2D (2/2)
Andries van Dam
Rotate by about origin
=

where
=
(original vertex)

=
(new vertex)

Derive
by determining how 1 and 2 should be

transformed
1 =
1
0

cos
sin
, first column of

2 =
0
1

sin
cos
, second column of

Thus we obtain
:
cos

11/44
Rotation in 2D (1/2)
6
t
u =
u
Andries van Dam
Lets try matrix-vector multiplication and see what we get

=
cos

=
x cos y sin
x sin + y cos
=

= cos sin

= sin + cos
Other properties of rotation:
preserves lengths in objects, and angles between parts of
objects
rotation is rigid-body
for objects not at the origin, again a translation may be unwanted
(i.e., this rotates about origin, not about houses center of rotation)

12/44
Rotation in 2D (2/2)
Andries van Dam
Translation not a linear transformation (not centered about origin)
Cant be represented as a 2x2 invertible matrix
Q: Is there another solution?
A: Yes,
= +, where =

Addition for translation this is inconsistent
If we could treat all transformations in a consistent manner, i.e.,
with matrix representation, then could combine transformations
by composing their matrices
Lets try using a Matrix again
How? Homogeneous Coordinates: add an additional dimension,
the w-axis, and an extra coordinate, the w-component
thus 2D -> 3D (effectively the hyperspace for embedding 2D space)
13/44
What about translation?
Andries van Dam
Allows expression of all three 2D transformations as 3x3 matrices
We start with the point
2
on the plane and apply a mapping to bring it to the
-plane in hyperspace

2
,
, , , 0
The resulting (, ) coordinates in our new point
are different from the

original (, ) , where = , =

, , 0
Once we have this point we can apply a homogenized version of our
transformation matrices (next slides) to it to get a new point in hyperspace
Finally, want to obtain resulting point in 2D-space again so perform a reverse of
previous mapping (divide all entries by ) to convert our point in hyperspace to a
corresponding point in 2D space

2
, =
2

Thus our transformation is complete
14/44
Homogeneous Coordinates (1/3)
Andries van Dam
Make transformations map points in hyperplane to another point in
hyperplane. Transformations applied to a point in the hyperplane will
always yield a result also in the same hyperplane (mathematical
closure)
Transformation applied to =
1
maps to =
1

How do we apply this to our transformation matrices?
For linear transformations, maintain 2x2 sub-matrix, expand the matrix
as follows, where for 2D transformations, the upper left submatrix is
the embedding of either the scale or the rotation matrix derived earlier:
0
0
0 0 1

Now that we have this form at our disposal, lets look at translations
15/44
Homogeneous Coordinates (3/3)
Andries van Dam

2
is the intersection of the line determined by
with the = 1 plane

For our geometric transformations = 1 is preserved, so all points stay on the
= 1 plane
To reiterate, the vertex =
is now represented as =
1

We place our vertex on the hyperplane = 1 in Euclidean space

16/44
Homogeneous coordinates (2/3)
Andries van Dam
Our translation matrix () can now be represented by embedding the
translation vector in the rightcolumn at the top as:

1 0
0 1
0 0 1

Try it - multiply it by our homogenized vertex
1

=
1 0
0 1
0 0 1

1
=
+
+
1
=
Coordinates have been translated, still Homogeneous
17/44
Back to Translation
Andries van Dam
Translation uses a 3x3 Matrix, but Scaling and Rotation are 2x2 Matrices
Lets homogenize! Doesnt affect linearity property of scaling and rotation
Our new transformation matrices look like this

Note: These 3 transformations are called affine transformations

18/44
Transformations Homogenized
Transformation Matrix
Scaling
0 0
0
0
0 0 1

Rotation
cos 0
0
0 0 1

Translation
1 0
0 1
0 0 1

Andries van Dam
Scaling: Scale by 15 in the direction, 17 in the
15 0 0
0 17 0
0 0 1

Rotation: Rotate by 123
cos(123) sin (123) 0
sin (123) cos (123) 0
0 0 1

Translation: Translate by -16 in the , +18 in the
1 0 16
0 1 18
0 0 1

19/44
Examples
Andries van Dam
Up until now, weve only used the notion of a point in our 2D space
We now present a distinction between points and vectors

vs.

We used Homogeneous coordinates to more conveniently represent
translation; hence points are represented as

A vector can be rotated/scaled, not translated (always starts at origin),
dont use the Homogeneous coordinate,

For now, lets focus on just our points (typically vertices)
20/44
Before we continue! Vectors vs. Points(Vertices)
Andries van Dam
How do we find the inverse of a transformation?
Take the inverse of the transformation matrix (thanks to
homogenization, theyre all invertible!):

21/44
Inverses
Transformation Matrix Inverse Does it make sense?
Scaling
1/
0 0
0 1/
0
0 0 1

If you scale something by
factor X, the inverse is
scaling by 1/X

Rotation
cos 0
0
0 0 1

Not so obvious, but can use
math! Rotation Matrix is
orthonormal, so inverse
should just be the transpose,
(proof on slide 23)
Translation
1 0
0 1
0 0 1

If you translate by X, the
inverse is translating by -X

Andries van Dam
Some uses well be seeing later
Placing sub-objects in parents coordinate system to
construct hierarchical scene graph
transforming primitives their own coordinate systems

View volume normalization
mapping arbitrary view volume into canonical view volume along -axis

Parallel (orthographic, oblique) and perspective projection

Perspective transformation (turn viewing pyramid into a
cuboid to turn perspective projection into parallel
projection)
22/44
More with Homogeneous Coordinates
Andries van Dam
The inverse of a rotation matrix is just its transpose,
! Thats
really convenient, so lets understand how it works
Take a rotation matrix = 1 2 3
First note these properties of
Columns are orthogonal to each other: v
i
v
j
= 0 (i = j)
Columns represent unit length vectors: ||v
i
|| = 1
Lets see what happens when we multiply
and :
=
1 1 1 2 1 3
2 1 2 2 2 3
3 1 3 2 3 3

Using the properties we defined we can see that the result is the
identity matrix
1 0 0
0 1 0
0 0 1
, thus
= I, and by definition of matrix

inverse, matrix
must be inverse of

23/44
A moment of appreciation for linear algebra
Andries van Dam
We now have a number of tools at our disposal, we can combine them!
An object in a scene uses many transformations in sequence, how do we
represent this in terms of functions?

A transformation is a function; by associativity we can compose
functions: ( )
This is the same as first applying to some input then applying :
((()))
Consider our functions and as matrices (
1
and
2
respectively)
and our input as a vector ()
Our composition is equivalent to
1
2

24/44
Composition of Transformations (2D) (1/2)
Andries van Dam
We can now form compositions of transformation matrices to form a more
complex transformation
For example,, which scales point, then rotates, then translates:
1 0
0 1
0 0 1

cos 0
0
0 0 1

s
0 0
0 s
0
0 0 1

1

Note that we apply the matrices in sequence right to left, but practically, given
associativity, we can compose them and apply the composite to all the vertices
in, say, a mesh.
Important: Order Matters!
Matrix Multiplication is not commutative.
Lets see an example
Be sure to check out the Transformation Game at
http://www.cs.brown.edu/exploratories/freeSoftware/repository/edu
/brown/cs/exploratories/applets/transformationGame/transformatio
n_game_guide.html

25/44
Composition of Transformations (2D) (2/2)
Andries van Dam 26/44
Not commutative
Translate by
=6, =0 then
rotate by 45
Rotate by 45
then translate
by =6, =0
0
1
1
2
2
3 4 5 6 7 8 9 10
3
4
5
6
Y
X
0
1
1
2
2
3 4 5 6 7 8 9 10
3
4
5
6
Andries van Dam

Start: Goal:

Important concept: Make the problem simpler
Translate object to origin first, scale , rotate, and translate back

1 0 3
0 1 3
0 0 1
cos90 90 0
90 90 0
0 0 1
3 0 0
0 3 0
0 0 1
1 0 3
0 1 3
0 0 1

Apply to all vertices

27/44
Composition (an example) (2D) (1/2)
Rotate 90
Uniform Scale 3x
Both around objects center,
not the origin
Andries van Dam

But what if we mixed up the order? Lets try
cos90 90 0
90 90 0
0 0 1
1 0 2
0 1 2
0 0 1
3 0 0
0 3 0
0 0 1
1 0 2
0 1 2
0 0 1

Oops! We managed to scale it properly but when we rotated it we rotated the object
about the origin, not its own center, shifting its positionOrder Matters!
28/44
Composition (an example) (2D) (2/2)
Andries van Dam 29/44
Aside: Skewing/shearing
Skew an object to the side, like sliding a card deck by
displacing each card relative to the previous one:

Squares become parallelograms - coordinates skew to right,
stays same
90
between coordinate axes becomes

Notice that base of house (at =1)
remains horizontal, but shifts right - why?
Y
X
0
1
1
2
2
3 4 5 6 7 8 9 10
3
4
5
6
u
4
t
u =
(
(
=
1 0
tan
1
1
u u
Skew
2D non-Homogeneous
(
(
(
(
(
=
1 0 0
0 1 0
0
tan
1
1
u
u
Skew
2D Homogeneous
Andries van Dam
What is the inverse of a sequence of transformations?

Inverse of a sequence of transformations is the composition of the
inverses of each transformation in reverse order

Say we want to do the opposite transform of the example on Slide
27, what will our sequence look like?
1 0 2
0 1 2
0 0 1
1/3 0 0
0 1/3 0
0 0 1
cos90 90 0
90 90 0
0 0 1
1 0 2
0 1 2
0 0 1

We still translate to origin first, then translate back at the end!

30/44
Inverses Revisited
Andries van Dam
Windowing transformation maps contents of a 2D clip rectangle
("window") to a rectangle on the screen, e.g., interior canvas of a
window manager's window ("viewport"), so also known as window-to-
viewport transformation
Sends rectangle with bounding coordinates
1
,
1
, (
2
,
2
)to
1
,
1
,
2
,
2

(
2
1
)/(
2

1
) 0 (
1
2

2
1
)/(
2

1
)
0 (
2

1
)/(
2

1
) (
1
2

2
1
)/(
2

1
)
0 0 1

31/44
Aside: Windowing Transformations
Andries van Dam
We understand linear transformations as changing the position of
vertices relative to the standard axes
Can also think of transforming the coordinate axes themselves

Just as in matrix composition, be careful of which order you
modify your coordinate system
32/44
Aside: Transforming Coordinate Axes
Rotation
Scaling
Translation
Andries van Dam
How should we treat geometric
transformations in 3D?
Just add one more coordinate/axis!

A point is represented as

A matrix for a linear transformation can be represented as

(1) (2) (3)

where 3 corresponds to the z-coordinate,
0
0
1

But remember to use homogeneous coordinates! Thus embed the scale
and rotation matrices upper left submatrix, translation vector upper
right column
33/44
Dimension++ (3D!)
Andries van Dam
Transformation Matrix Comments
Scaling
0 0 0
0
0 0
0 0
0
0 0 0 1

Looks just like the 2D version
right? We just added an s
z
term.

Rotation
See next slide
This ones more complicated. In
2D there is only one axis of
rotation. In 3D there are infinitely
many, thus the matrix has to take
into account all possible axes.
See next slide
Translation
1 0 0
0 1 0
0 0 1
0 0 0 1

Similar to the 2D version, we just
have one more term, ,
representing change in the axis

34/44
Transformations in 3D
Andries van Dam
Rotation by angle around vector =

Heres a not so friendly rotation matrix:

This is called the coordinate form of Rodriguess formula
Lets try a different way
35/44
Rodriguess Formula
Note: This is an arbitrary unit vector in space
Andries van Dam
Every rotation can be represented as the composition of 3 different angles of
COUNTER-CLOCKWISE rotation around 3 axes, namely
-axis in the plane by
Also known as Euler angles, makes problem of rotation much easier

: rotation around axis,
: rotation about axis,
: rotation about axis

Note these differ only in where they are embedded in the homogeneous matrix
You can compose these matrices to form a composite rotation matrix

36/44
Rotating axis by axis (1/2)
()

0 0
0 0
0 0 1 0
0 0 0 1

1 0 0 0
0 0
0 0
0 0 0 1

0 0
0 1 0 0
0 0
0 0 0 1

Andries van Dam
It would still be difficult to find the 3 angles to rotate by, given arbitrary axis
and specified angle
Solution? Make the problem easier by mapping u to one of the principal axes

Step 1: Find a to rotate around axis to put in the plane

Step 2: Then find a to rotate around the axis to align with
the axis

Step 3: Rotate by around axis = coincident axis

Step 4: Finally, undo the alignment rotations (inverse)

Rotation Matrix: =
()

37/44
Rotating axis by axis (2/2)
Andries van Dam
Inverses are once again parallel to their 2D versions

Composition works exactly the same way

38/44
Inverses and Composition in 3D!
Transformation Matrix Inverse
Scaling
1/
0 0 0
0 1/
0 0
0 0 1/
0
0 0 0 1

Rotation
1 0 0 0
0 0
0 0
0 0 0 1
0 0
0 0
0 0 1 0
0 0 0 1
0 0
0 1 0 0
0 0
0 0 0 1

Translation
1 0 0
0 1 0
0 0 1
0 0 0 1

Andries van Dam
Lets take some 3D object, say a cube, centered at (2,2,2)
Rotate in objects space by 30 around axis, 60 around and 90 around
Scale in object space by 1 in the , 2 in the , 3 in the
Translate by (2,2,4)
Transformation Sequence:
, where
translates to (0,0)
1 0 0 2
0 1 0 2
0 0 1 4
0 0 0 1

1 0 0 2
0 1 0 2
0 0 1 2
0 0 0 1

1 0 0 0
0 2 0 0
0 0 3 0
0 0 0 1

90 90 0 0
90 90 0 0
0 0 1 0
0 0 0 1

60 0 60 0
0 1 0 0
60 0 60 0
0 0 0 1
1 0 0 0
0 30 30 0
0 30 30 0
0 0 0 1
1 0 0 2
0 1 0 2
0 0 1 2
0 0 0 1

39/44
Example in 3D!
Andries van Dam
Objects can be complex:

3D scenes are often stored in a directed acyclic graph (DAG) called a scene graph
WPF
Open Scene Graph (used in the Cave)
Suns Java3D
X3D (VRML was a precursor to X3D)
Typical scene graph format:
objects (cubes, sphere, cone, polyhedra etc.): stored as nodes (default: unit size at origin)
attributes (color, texture map, etc.) stored as separate nodes
transformations are also nodes
40/44
Transformations and the scene graph (1/4)
ROBOT
transformation
upper body lower body
head trunk arm
base
Scene graph (an abstraction)
(see Sceneview assignment)
stanchion
Andries van Dam
For your assignments, use simplified format:
attributes stored as a component of each object node (no separate
attribute node)
transform node affects its sub-tree
only leaf nodes are graphical objects
all internal nodes that are not transform nodes are group nodes

41/44
Step 1: Various transformations
are applied to each of the leaves
(object primitives-head, base)
Step 2: Transformations are
then applied to groups of these
objects as a whole (upper body,
lower body)

Together this hierarchy of
transformations forms the
robot scene as a whole
Represents a
transformation
Andries van Dam
Notion of a cumulative
transformation matrix that builds as
you move up the tree (),
appending higher level
transformation matrices to the front
of your sequence

Example:
For o1, =

For o2, =

For o3, =

For a vertex v in o3, position in
world (root) coordinate system is:
= (
)
42/44
object nodes (geometry)
transformation nodes
group nodes

Andries van Dam
You can reuse groups of objects (sub-trees) if they have been
defined

Group 3 has been used twice here
Transformations defined within group 3 itself are the same
Different s for each use of group 3 as a whole

43/44
group3
obj3
obj4

root

group1

obj1 group3

group2
group3 obj2
Andries van Dam
read Chapters 10 and 11 for more detail and
advanced topics on transformations

chapter 7 talks about the 2D/3D coordinate
space geometry

chapter 12 goes into more detail about some of
the linear algebra involved in graphics
44/44
Further Reading

Geometric Transformations: 2D and 3D

Caricato da

Informazioni sul documento

Descrizione originale:

Titolo originale

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

Geometric Transformations: 2D and 3D

Caricato da

Copyright:

Formati disponibili

CS123 | INTRODUCTION TO COMPUTER GRAPHICS

Andries van Dam

) , the first column of

), the second column of

= , where is some diagonal matrix

entry along diagonal of

by determining how 1 and 2 should be

are different from the

with the = 1 plane

= I, and by definition of matrix

between coordinate axes becomes

: rotation around axis,

: rotation about axis,

: rotation about axis

Potrebbero piacerti anche