Professional Documents
Culture Documents
Chapter 3 Slide - Coordinate Transformations
Chapter 3 Slide - Coordinate Transformations
Chapter Three:
Geometrical Transformations
⦁ 2D Transformations
⦁ Matrix representation
⦁ Homogeneous Coordinates
⦁ 3D Transformations
⦁ Combination of Transformation
⦁ DefiningTransformations in OpenGL
2
Transformations
⦁ What are transformations?
⦁ changing something to something else via rules
⦁ Mathematics: mapping between values in a range set and
domain set (function/relation)
⦁ G eometric:translate,rotate,scale,shear,reflection…
⦁ Why are they important to graphics?
⦁ Moving objects on screen or in space
⦁ Specifying the camera’s view of a 3D scene
⦁ Mapping from model space to world space to camera
space to screen space
⦁ Specifying parent/child relationships
3
Transformations…
❖ In Computer graphics, Transformation is a process of
modifying and re-positioning the existing graphics.
❖ 2D Translation is a process of moving an object from
one position to another in a two dimensional plane.
Transformation Techniques are:
➢ Position (translation)
➢ Size (scaling)
➢ Orientation (rotation)
➢ Shapes (shear)
➢ Mirror(reflection)
4
2D Transformations
⦁ 2D MatrixTransformations
⦁ We can use a column vector (a 2x1 matrix) to represent a 2D point
(x,y) x
y
⦁ Matrix addition and multiplication
⦁ Addition
⦁ nxn + nxn matrix resulting in nxn matrix
⦁ Matrix addition is commutative and associative
⦁ Consider a 2x2 matrix
a b + e f a+e b+ f
=
c d g h c + g d + h
5
2D Transformations…
⦁ Multiplication
⦁ To perform multiplication we need nxm * mxp or square matrix
⦁ Consider a 2x2 matrices
a b e f ae + bg af + bh
=
c d g h ce + dg cf + dh
For example:
3 −1
1 2 31−12 32−10 1 6
= =
2 1 2 0 21+12 22+10 4 4
⦁ Matrix multiplication is not commutative
⦁ For two matrices A and B,AB≠BA.
⦁ Matrix multiplication is associative.
⦁ For three matrices A,B and C,then (AB)C = A(BC)
6
2D Translation
⦁ Shifts all points by the same amount
⦁ In translation the size and shape of object cannot changed
⦁ It is rigid object transformation
px px p x t x
P = P = p x tx
T =
= +
p p t
p y y y
py y ty
• The relationship between points
before and after the translation
is:
px = p x + t x and
py = p y + t y
8
2D Rotation
⦁ Rotation is rigid body transformation
⦁ Rotates all points about a centre of rotation
⦁ The rotation transformation has a single parameter:
⦁ The angle of rotation,θ
9
2D Rotation…
⦁ Default rotation center:Origin (0,0)
⦁ θ> 0 :Rotate counter clockwise
⦁ θ< 0 : Rotate clockwise
⦁ Rotation of object about an arbitrary pivot point
y
P’(x’,y’)
P(x,y)
Θ
yr
xr
x
⦁ X’ = xr +(x-xr)cosΘ –(y-yr)sinΘ
⦁ Y’ =yr + (x-xr)sinΘ +(y-yr)cosΘ
10
2D Scaling
⦁ Multiplies each coordinate point by a scale factor.
⦁ Uniform scaling (Sx = Sy),shape of an object is not changed
⦁ Differential scaling (Sx ≠ Sy),shape changed
11
Exercise
⦁ Apply the following transformations: translation tx=3, ty=2,
rotation θ =600 counter clockwise and scaling sx= 2, sy =1) to
object given below.Keep center of rotation and scaling at (2,2).
y (2,7) (7,7)
(2,2) (7,2)
x
12
Homogeneous Coordinates
⦁ We add an extra coordinate:
⦁ Homogenous parameter
⦁ 2D points are stored as three values.
⦁ The relationship between homogeneous points and Cartesian
points is:
x
o Homogeneou s point = y
h
x/h
oC a rtesian point =
y / h
1
13
2D Homogeneous Coordinate Translation
⦁ We can express a translation transformation using a single matrix
multiplication:
p x
, 1 tx
p 0
x
P = p y
P = p y T = 0 1 ty
1
1 0 0 1
px 1 0 tx px
py = 0 1 ty py
1 0 0 1 1
p x cos − sin
0 px
py = sin cos 0 p y
1
1 0 0 1
• Therefore:
15
2D Homogeneous Coordinate Scaling
⦁ Scaling using homogeneous coordinates:
Sx 0 0
S = 0 Sy 0
1
0 0
p
x x
S 0 0 p x
p y = 0 Sy 0 p y
1
1 0 0 1
16
Composite Transformations
⦁ Successive Rotations
⦁ Successive Scaling
17
Successive Translations
18
Successive Rotations
⦁ Two successive rotations applied to a point P produce the
transformed position.
⦁ P’ = R(θ1).P
⦁ P’’ = R(θ2).P’
⦁ Or
⦁ P’’ = R(θ2).R(θ1).P
⦁ Two successive rotations are additive
⦁ P’ = R(θ1 + θ2).P
19
Successive Scaling
Reflection
⦁ Is transformation that produce a mirror images of an object.
⦁ The mirror images for a 2D reflection is generated relative to
an axis of reflection by rotating the object about 180 degree
about the reflection axis.
⦁ Reflection about x axis (y=0)
⦁ Reflection about y axis (x=0)
⦁ Reflection about an axis perpendicular to xy to plane passes through
origin
⦁ Reflection about diagonal line (y=x)
21
Reflection...
sx = -1 sy = 1 original
sx = -1 sy = -1 sx = 1 sy = -1
Reflection about x axis (y=0)
⦁ Reflection about x axis keeps x values same, but flips the y
value
⦁ Transformation can be represented in matrix.
P= 1 0 x'
x
Rf = =
P'
y 0 −1 y'
x’ = x
y’ = -y
23
Reflection about y axis (x=0)
⦁ Reflection about y axis keep y values the same but flips the
x value
⦁ Transformation can be represented in matrix.
P= −1 0
P'=
x x'
Rf =
y 0 1 y'
24
Reflection about an axis perpendicular to xy to
plane passes through origin
⦁ It flips both x and y values
⦁ Transformation can be represented in matrix.
P=
x −1 0 x'
Rf = P'=
y 0 −1 y'
−1 0 x − x
P’ = Rf. P = =
0 −1 y − y
x’ = -x
y’ = -y
25
Reflection about diagonal line (y=x)
⦁ It changes the value of x with y value and y value with
x value
⦁ Transformation can be represented in matrix.
x 0 1
P= P'=
x'
Rf =
y 1 0 y'
0 1 x y
P’ = Rf.P = 1 0 y = x
x’ = y
y’ = x
26
Shearing
⦁ Shearing is a transformation that distort the shape of an object
⦁ Shearing will not change the area of the object
⦁ Positive shear factor shift to right while negative shear factor
shift to left.
⦁ Any 2D shearing can be done by a rotation, followed by a
scaling, and followed by a rotation
⦁ Two form of shearing
⦁ Shift coordinate x value(x-direction shear)
⦁ Shift coordinate y value(y-direction shear)
27
X-direction Shearing
⦁ x-direction shear is relative to x axis
⦁ Y coordinates are unaffected,but x coordinates are translated
linearly with y.
29
3D Transformations
⦁ Introduce a one coordinate in addition to the x, and y coordinates,
that is z-coordinate.
1. 3D HomogeneousTranslation
• Defined by three translation parameters: tx, ty and tz.
• Given by:
1 0 0 tx px 1 0 0 tx px
T =
0 1 0 ty py = 0 1 0 ty py
0 1 t z p 0
0
0 1 tz pz
z
0 0 0 1
1 0 0 0 1 1
• Therefore:
30
2. 3D Homogeneous Rotation
⦁ There are three possible axes: x, y,and z
⦁ The form of the rotation matrix depends on which type of
rotation we want to perform.
1 0 0 0
🞂 Matrix, rotation about the x-axis
0 cos − sin 0 ⦁ x’ = x
Rx =
0 sin co s 0 ⦁ y’ = ycosθ –zsinθ
0 0 0 1 ⦁ z’ = ysinθ + zcosθ
cos 0 sin 0
0 1 0 0 🞂 Matrix , rotation about the y-axis
Ry =
− sin 0 co s 0 ⦁ x’ = xcosθ + zsinθ
0 0 0 1 ⦁ y’ = y
cos − sin 0 0 ⦁ z’ = zcosθ - xsinθ
sin cos 0 0 ⦁ Matrix, rotation about the z-axis
Rz =
0 0 1 0 ⦁ x’ = xcosθ - ysinθ
0 0 0 1 ⦁ y’ = xsinθ + ycosθ
⦁ z’ = z
31
3. 3D Homogeneous Scaling
⦁ Are defined by three scaling parameters, Sx, Sy and Sz.
Sx 0 0 0
0
S =
0 Sy 0
0 0 Sz 0
0 0 0 1
px S x 0 0 0 p x
py = 0 Sy 0 0 p y
p 0 0 Sz 0 p z
z
1 0 0 0 1 1
32
Defining Transformations in OpenGL
⦁ When concatenating a sequence of matrices, a graphics package may pre
multiply or post multiply.
⦁ A is premultiplied by B:B A
⦁ A is postmultiplied by B:A B
⦁ For example, if we pre multiply matrix A by matrix B,the result will be BA.
33
Defining Transformations in OpenGL…
⦁ OpenGL functions for defining transformations:
⦁ glTranslate*(tx,ty,tz):
⦁ E.g.glTranslated(320.0,260.0,0.0);
⦁ Suffix can be d or f
⦁ glRotate*(θ,vx,vy,vz):
⦁ 1st argument:rotation angle in degree
⦁ 2nd/3rd/4th arguments are a vector that defines the axis of rotation
⦁ E.g.glRotated(45.0,0.0,0.0,1.0);
⦁ glScale*(Sx,Sy,Sz):
⦁ E.g.glScalef(2.0,-3.0,1.0)
34
Defining Transformations in OpenGL…
⦁ glLoadMatrix*(elements16):
⦁ Argument is a one-dimensional array of 16 matrix coefficients
⦁ 4x4 matrix for homogeneous coordinates
⦁ Column-major order (i.e. coefficients of first column, then
coefficients of second column,etc.)
⦁ glMultMatrix*(elements16):
⦁ Same as glLoadMatrix*, except it multiplies the specified matrix by
the current matrix
⦁ glLoadIdentity(elements16):
⦁ Used to set the current matrix to the identity matrix
35
Defining Transformations in OpenGL…
⦁ OpenGL has an associated matrix stack.
⦁ To remember previous transformations.
⦁ There are two functions for manipulating the stack:
⦁ glPushMatrix:
⦁ Copy the current matrix to the next position down in the stack
⦁ glPopMatrix:
⦁ Destroy the current matrix, and move all other matrices on the
stack up one position.
⦁ Example:
glLoadIdentity();
glTranslated(2.0, 2.0, 0.0);
glRotated(90.0, 0.0, 0.0, 1.0);
glTranslated(-2.0, -2.0, 0.0);
36