Upload
others
View
7
Download
0
Embed Size (px)
Citation preview
Chapter 7Two-Dimensional Geometric
Transformations
Computer Graphics
Chapter 7Two-Dimensional Geometric Transformations
Part IbullBasic 2D Geometric TransformationsbullMatrix Representations and Homogeneous Coordinatesbull2D Composite Transformations
2
Transformation A transformation is an operation that transforms or changes a shape Linear and affine (仿射) transformations are central to computer
graphics Linear a mapping that preserves linear combinations in a vector space
including rotation scaling (缩放) shearing(剪切)hellip Affine any transformation that preserves collinearity (共綫性 ie all points
lying on a line initially still lie on a line after transformation) and ratios of distances (eg the midpoint of a line segment remains the midpoint after transformation) Composed of linear transformations and a translation (or ldquoshiftrdquo)
Important features Straight lines to straight lines Preserve parallelism Implemented by matrix multiplication
3
Several basic ways you can change a shape
Translation (moving it)
Rotation (turning it round)
Scaling (making it bigger or smaller)
Shear (changing the main shape)
Reflection (mirroring the shape about axis)
Transformation
Translate
Rotate
Scale
Shear
Reflect
4
2D Translation A translation moves an object into a different position in a
scene without changing its shape
This is achieved by adding an offsettranslation vectorto the original coordinates
In vector notation
x
y
PP
=
P
x xx
y yy
P tPP tP
= +
x
y
tt
=
T
Original points Transformed points
Translate by T
T
5
Eg translate the point (12) using translation vector (56)
The new point position is (6 8)
To translate line translate its endpoints To translate polygon translate its vertices
2D Translation
=
++
=
+
86
6251
65
21
6
2D Translation The routine of the transformation operation
void translatePolygon (wcPt2D verts GLint nVerts GLfloat tx GLfloat ty)
GLint k
for (k = 0 k lt nVerts k++) verts [k]x = verts [k]x + txverts [k]y = verts [k]y + ty
glBegin (GL_POLYGON)for (k = 0 k lt nVerts k++)
glVertex2f (verts [k]x verts [k]y)glEnd ()
class wcPt2D public
GLfloat x y
7
2D Rotation To rotate points through the specified rotation angle (θ) and
rotation axis (Z - axis) Rotation axis is perpendicular to XY plane and they intersect at
point (xr yr) (pivot point) θ is positive - a counterclockwise rotation
θ is negative - a clockwise rotation
Figure 7-3 Rotationof an object through Angle θ about the pivot point (xr yr)
Figure 7-4 Rotation of a point from position (x y) to position (x y) through an angle θrelative to the coord origin
Figure 7-5 Rotating a point from position (x y) to position (x y) through an angle θabout rotation point (xr yr)
8
2D Rotation - derivation
cos ( ) cos cos sin sin θ φ θ φ θ φ+ = minus( ) ( ) ( ) ( )sin( ) sin cos cos sin θ φ θ φ θ φ+ = +( ) ( ) ( ) ( )
P
Q
RPX
PYφ
θ
[1][2]
[3][4]
[1] )( )( )( )( φθφθ sinsincoscos RRxQ minus=
Substituting [3] and [4] into [1] )( )( θθ sincos yPxPxQ minus=
Similarly for [2] )( )( θθ sincos xPyPyQ +=
)cos( φθ += RQ X
)sin( φθ += RQ y
)(cos φRPX = )(sin φR Py =
Rotation of point P relative to the coordinate origin
( Trigonometric identities (三角恒等式))
9
2D Rotation - derivation With the column-vector representations for coordinate positions
the rotation equations in the matrix formQ = RP
where the rotation matrix is
Therefore general equations for rotation of a point (x y) about any specified pivot ( xr yr ) (eg Fig 7-9)
10
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Chapter 7Two-Dimensional Geometric Transformations
Part IbullBasic 2D Geometric TransformationsbullMatrix Representations and Homogeneous Coordinatesbull2D Composite Transformations
2
Transformation A transformation is an operation that transforms or changes a shape Linear and affine (仿射) transformations are central to computer
graphics Linear a mapping that preserves linear combinations in a vector space
including rotation scaling (缩放) shearing(剪切)hellip Affine any transformation that preserves collinearity (共綫性 ie all points
lying on a line initially still lie on a line after transformation) and ratios of distances (eg the midpoint of a line segment remains the midpoint after transformation) Composed of linear transformations and a translation (or ldquoshiftrdquo)
Important features Straight lines to straight lines Preserve parallelism Implemented by matrix multiplication
3
Several basic ways you can change a shape
Translation (moving it)
Rotation (turning it round)
Scaling (making it bigger or smaller)
Shear (changing the main shape)
Reflection (mirroring the shape about axis)
Transformation
Translate
Rotate
Scale
Shear
Reflect
4
2D Translation A translation moves an object into a different position in a
scene without changing its shape
This is achieved by adding an offsettranslation vectorto the original coordinates
In vector notation
x
y
PP
=
P
x xx
y yy
P tPP tP
= +
x
y
tt
=
T
Original points Transformed points
Translate by T
T
5
Eg translate the point (12) using translation vector (56)
The new point position is (6 8)
To translate line translate its endpoints To translate polygon translate its vertices
2D Translation
=
++
=
+
86
6251
65
21
6
2D Translation The routine of the transformation operation
void translatePolygon (wcPt2D verts GLint nVerts GLfloat tx GLfloat ty)
GLint k
for (k = 0 k lt nVerts k++) verts [k]x = verts [k]x + txverts [k]y = verts [k]y + ty
glBegin (GL_POLYGON)for (k = 0 k lt nVerts k++)
glVertex2f (verts [k]x verts [k]y)glEnd ()
class wcPt2D public
GLfloat x y
7
2D Rotation To rotate points through the specified rotation angle (θ) and
rotation axis (Z - axis) Rotation axis is perpendicular to XY plane and they intersect at
point (xr yr) (pivot point) θ is positive - a counterclockwise rotation
θ is negative - a clockwise rotation
Figure 7-3 Rotationof an object through Angle θ about the pivot point (xr yr)
Figure 7-4 Rotation of a point from position (x y) to position (x y) through an angle θrelative to the coord origin
Figure 7-5 Rotating a point from position (x y) to position (x y) through an angle θabout rotation point (xr yr)
8
2D Rotation - derivation
cos ( ) cos cos sin sin θ φ θ φ θ φ+ = minus( ) ( ) ( ) ( )sin( ) sin cos cos sin θ φ θ φ θ φ+ = +( ) ( ) ( ) ( )
P
Q
RPX
PYφ
θ
[1][2]
[3][4]
[1] )( )( )( )( φθφθ sinsincoscos RRxQ minus=
Substituting [3] and [4] into [1] )( )( θθ sincos yPxPxQ minus=
Similarly for [2] )( )( θθ sincos xPyPyQ +=
)cos( φθ += RQ X
)sin( φθ += RQ y
)(cos φRPX = )(sin φR Py =
Rotation of point P relative to the coordinate origin
( Trigonometric identities (三角恒等式))
9
2D Rotation - derivation With the column-vector representations for coordinate positions
the rotation equations in the matrix formQ = RP
where the rotation matrix is
Therefore general equations for rotation of a point (x y) about any specified pivot ( xr yr ) (eg Fig 7-9)
10
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Transformation A transformation is an operation that transforms or changes a shape Linear and affine (仿射) transformations are central to computer
graphics Linear a mapping that preserves linear combinations in a vector space
including rotation scaling (缩放) shearing(剪切)hellip Affine any transformation that preserves collinearity (共綫性 ie all points
lying on a line initially still lie on a line after transformation) and ratios of distances (eg the midpoint of a line segment remains the midpoint after transformation) Composed of linear transformations and a translation (or ldquoshiftrdquo)
Important features Straight lines to straight lines Preserve parallelism Implemented by matrix multiplication
3
Several basic ways you can change a shape
Translation (moving it)
Rotation (turning it round)
Scaling (making it bigger or smaller)
Shear (changing the main shape)
Reflection (mirroring the shape about axis)
Transformation
Translate
Rotate
Scale
Shear
Reflect
4
2D Translation A translation moves an object into a different position in a
scene without changing its shape
This is achieved by adding an offsettranslation vectorto the original coordinates
In vector notation
x
y
PP
=
P
x xx
y yy
P tPP tP
= +
x
y
tt
=
T
Original points Transformed points
Translate by T
T
5
Eg translate the point (12) using translation vector (56)
The new point position is (6 8)
To translate line translate its endpoints To translate polygon translate its vertices
2D Translation
=
++
=
+
86
6251
65
21
6
2D Translation The routine of the transformation operation
void translatePolygon (wcPt2D verts GLint nVerts GLfloat tx GLfloat ty)
GLint k
for (k = 0 k lt nVerts k++) verts [k]x = verts [k]x + txverts [k]y = verts [k]y + ty
glBegin (GL_POLYGON)for (k = 0 k lt nVerts k++)
glVertex2f (verts [k]x verts [k]y)glEnd ()
class wcPt2D public
GLfloat x y
7
2D Rotation To rotate points through the specified rotation angle (θ) and
rotation axis (Z - axis) Rotation axis is perpendicular to XY plane and they intersect at
point (xr yr) (pivot point) θ is positive - a counterclockwise rotation
θ is negative - a clockwise rotation
Figure 7-3 Rotationof an object through Angle θ about the pivot point (xr yr)
Figure 7-4 Rotation of a point from position (x y) to position (x y) through an angle θrelative to the coord origin
Figure 7-5 Rotating a point from position (x y) to position (x y) through an angle θabout rotation point (xr yr)
8
2D Rotation - derivation
cos ( ) cos cos sin sin θ φ θ φ θ φ+ = minus( ) ( ) ( ) ( )sin( ) sin cos cos sin θ φ θ φ θ φ+ = +( ) ( ) ( ) ( )
P
Q
RPX
PYφ
θ
[1][2]
[3][4]
[1] )( )( )( )( φθφθ sinsincoscos RRxQ minus=
Substituting [3] and [4] into [1] )( )( θθ sincos yPxPxQ minus=
Similarly for [2] )( )( θθ sincos xPyPyQ +=
)cos( φθ += RQ X
)sin( φθ += RQ y
)(cos φRPX = )(sin φR Py =
Rotation of point P relative to the coordinate origin
( Trigonometric identities (三角恒等式))
9
2D Rotation - derivation With the column-vector representations for coordinate positions
the rotation equations in the matrix formQ = RP
where the rotation matrix is
Therefore general equations for rotation of a point (x y) about any specified pivot ( xr yr ) (eg Fig 7-9)
10
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Several basic ways you can change a shape
Translation (moving it)
Rotation (turning it round)
Scaling (making it bigger or smaller)
Shear (changing the main shape)
Reflection (mirroring the shape about axis)
Transformation
Translate
Rotate
Scale
Shear
Reflect
4
2D Translation A translation moves an object into a different position in a
scene without changing its shape
This is achieved by adding an offsettranslation vectorto the original coordinates
In vector notation
x
y
PP
=
P
x xx
y yy
P tPP tP
= +
x
y
tt
=
T
Original points Transformed points
Translate by T
T
5
Eg translate the point (12) using translation vector (56)
The new point position is (6 8)
To translate line translate its endpoints To translate polygon translate its vertices
2D Translation
=
++
=
+
86
6251
65
21
6
2D Translation The routine of the transformation operation
void translatePolygon (wcPt2D verts GLint nVerts GLfloat tx GLfloat ty)
GLint k
for (k = 0 k lt nVerts k++) verts [k]x = verts [k]x + txverts [k]y = verts [k]y + ty
glBegin (GL_POLYGON)for (k = 0 k lt nVerts k++)
glVertex2f (verts [k]x verts [k]y)glEnd ()
class wcPt2D public
GLfloat x y
7
2D Rotation To rotate points through the specified rotation angle (θ) and
rotation axis (Z - axis) Rotation axis is perpendicular to XY plane and they intersect at
point (xr yr) (pivot point) θ is positive - a counterclockwise rotation
θ is negative - a clockwise rotation
Figure 7-3 Rotationof an object through Angle θ about the pivot point (xr yr)
Figure 7-4 Rotation of a point from position (x y) to position (x y) through an angle θrelative to the coord origin
Figure 7-5 Rotating a point from position (x y) to position (x y) through an angle θabout rotation point (xr yr)
8
2D Rotation - derivation
cos ( ) cos cos sin sin θ φ θ φ θ φ+ = minus( ) ( ) ( ) ( )sin( ) sin cos cos sin θ φ θ φ θ φ+ = +( ) ( ) ( ) ( )
P
Q
RPX
PYφ
θ
[1][2]
[3][4]
[1] )( )( )( )( φθφθ sinsincoscos RRxQ minus=
Substituting [3] and [4] into [1] )( )( θθ sincos yPxPxQ minus=
Similarly for [2] )( )( θθ sincos xPyPyQ +=
)cos( φθ += RQ X
)sin( φθ += RQ y
)(cos φRPX = )(sin φR Py =
Rotation of point P relative to the coordinate origin
( Trigonometric identities (三角恒等式))
9
2D Rotation - derivation With the column-vector representations for coordinate positions
the rotation equations in the matrix formQ = RP
where the rotation matrix is
Therefore general equations for rotation of a point (x y) about any specified pivot ( xr yr ) (eg Fig 7-9)
10
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Translation A translation moves an object into a different position in a
scene without changing its shape
This is achieved by adding an offsettranslation vectorto the original coordinates
In vector notation
x
y
PP
=
P
x xx
y yy
P tPP tP
= +
x
y
tt
=
T
Original points Transformed points
Translate by T
T
5
Eg translate the point (12) using translation vector (56)
The new point position is (6 8)
To translate line translate its endpoints To translate polygon translate its vertices
2D Translation
=
++
=
+
86
6251
65
21
6
2D Translation The routine of the transformation operation
void translatePolygon (wcPt2D verts GLint nVerts GLfloat tx GLfloat ty)
GLint k
for (k = 0 k lt nVerts k++) verts [k]x = verts [k]x + txverts [k]y = verts [k]y + ty
glBegin (GL_POLYGON)for (k = 0 k lt nVerts k++)
glVertex2f (verts [k]x verts [k]y)glEnd ()
class wcPt2D public
GLfloat x y
7
2D Rotation To rotate points through the specified rotation angle (θ) and
rotation axis (Z - axis) Rotation axis is perpendicular to XY plane and they intersect at
point (xr yr) (pivot point) θ is positive - a counterclockwise rotation
θ is negative - a clockwise rotation
Figure 7-3 Rotationof an object through Angle θ about the pivot point (xr yr)
Figure 7-4 Rotation of a point from position (x y) to position (x y) through an angle θrelative to the coord origin
Figure 7-5 Rotating a point from position (x y) to position (x y) through an angle θabout rotation point (xr yr)
8
2D Rotation - derivation
cos ( ) cos cos sin sin θ φ θ φ θ φ+ = minus( ) ( ) ( ) ( )sin( ) sin cos cos sin θ φ θ φ θ φ+ = +( ) ( ) ( ) ( )
P
Q
RPX
PYφ
θ
[1][2]
[3][4]
[1] )( )( )( )( φθφθ sinsincoscos RRxQ minus=
Substituting [3] and [4] into [1] )( )( θθ sincos yPxPxQ minus=
Similarly for [2] )( )( θθ sincos xPyPyQ +=
)cos( φθ += RQ X
)sin( φθ += RQ y
)(cos φRPX = )(sin φR Py =
Rotation of point P relative to the coordinate origin
( Trigonometric identities (三角恒等式))
9
2D Rotation - derivation With the column-vector representations for coordinate positions
the rotation equations in the matrix formQ = RP
where the rotation matrix is
Therefore general equations for rotation of a point (x y) about any specified pivot ( xr yr ) (eg Fig 7-9)
10
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Eg translate the point (12) using translation vector (56)
The new point position is (6 8)
To translate line translate its endpoints To translate polygon translate its vertices
2D Translation
=
++
=
+
86
6251
65
21
6
2D Translation The routine of the transformation operation
void translatePolygon (wcPt2D verts GLint nVerts GLfloat tx GLfloat ty)
GLint k
for (k = 0 k lt nVerts k++) verts [k]x = verts [k]x + txverts [k]y = verts [k]y + ty
glBegin (GL_POLYGON)for (k = 0 k lt nVerts k++)
glVertex2f (verts [k]x verts [k]y)glEnd ()
class wcPt2D public
GLfloat x y
7
2D Rotation To rotate points through the specified rotation angle (θ) and
rotation axis (Z - axis) Rotation axis is perpendicular to XY plane and they intersect at
point (xr yr) (pivot point) θ is positive - a counterclockwise rotation
θ is negative - a clockwise rotation
Figure 7-3 Rotationof an object through Angle θ about the pivot point (xr yr)
Figure 7-4 Rotation of a point from position (x y) to position (x y) through an angle θrelative to the coord origin
Figure 7-5 Rotating a point from position (x y) to position (x y) through an angle θabout rotation point (xr yr)
8
2D Rotation - derivation
cos ( ) cos cos sin sin θ φ θ φ θ φ+ = minus( ) ( ) ( ) ( )sin( ) sin cos cos sin θ φ θ φ θ φ+ = +( ) ( ) ( ) ( )
P
Q
RPX
PYφ
θ
[1][2]
[3][4]
[1] )( )( )( )( φθφθ sinsincoscos RRxQ minus=
Substituting [3] and [4] into [1] )( )( θθ sincos yPxPxQ minus=
Similarly for [2] )( )( θθ sincos xPyPyQ +=
)cos( φθ += RQ X
)sin( φθ += RQ y
)(cos φRPX = )(sin φR Py =
Rotation of point P relative to the coordinate origin
( Trigonometric identities (三角恒等式))
9
2D Rotation - derivation With the column-vector representations for coordinate positions
the rotation equations in the matrix formQ = RP
where the rotation matrix is
Therefore general equations for rotation of a point (x y) about any specified pivot ( xr yr ) (eg Fig 7-9)
10
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Translation The routine of the transformation operation
void translatePolygon (wcPt2D verts GLint nVerts GLfloat tx GLfloat ty)
GLint k
for (k = 0 k lt nVerts k++) verts [k]x = verts [k]x + txverts [k]y = verts [k]y + ty
glBegin (GL_POLYGON)for (k = 0 k lt nVerts k++)
glVertex2f (verts [k]x verts [k]y)glEnd ()
class wcPt2D public
GLfloat x y
7
2D Rotation To rotate points through the specified rotation angle (θ) and
rotation axis (Z - axis) Rotation axis is perpendicular to XY plane and they intersect at
point (xr yr) (pivot point) θ is positive - a counterclockwise rotation
θ is negative - a clockwise rotation
Figure 7-3 Rotationof an object through Angle θ about the pivot point (xr yr)
Figure 7-4 Rotation of a point from position (x y) to position (x y) through an angle θrelative to the coord origin
Figure 7-5 Rotating a point from position (x y) to position (x y) through an angle θabout rotation point (xr yr)
8
2D Rotation - derivation
cos ( ) cos cos sin sin θ φ θ φ θ φ+ = minus( ) ( ) ( ) ( )sin( ) sin cos cos sin θ φ θ φ θ φ+ = +( ) ( ) ( ) ( )
P
Q
RPX
PYφ
θ
[1][2]
[3][4]
[1] )( )( )( )( φθφθ sinsincoscos RRxQ minus=
Substituting [3] and [4] into [1] )( )( θθ sincos yPxPxQ minus=
Similarly for [2] )( )( θθ sincos xPyPyQ +=
)cos( φθ += RQ X
)sin( φθ += RQ y
)(cos φRPX = )(sin φR Py =
Rotation of point P relative to the coordinate origin
( Trigonometric identities (三角恒等式))
9
2D Rotation - derivation With the column-vector representations for coordinate positions
the rotation equations in the matrix formQ = RP
where the rotation matrix is
Therefore general equations for rotation of a point (x y) about any specified pivot ( xr yr ) (eg Fig 7-9)
10
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Rotation To rotate points through the specified rotation angle (θ) and
rotation axis (Z - axis) Rotation axis is perpendicular to XY plane and they intersect at
point (xr yr) (pivot point) θ is positive - a counterclockwise rotation
θ is negative - a clockwise rotation
Figure 7-3 Rotationof an object through Angle θ about the pivot point (xr yr)
Figure 7-4 Rotation of a point from position (x y) to position (x y) through an angle θrelative to the coord origin
Figure 7-5 Rotating a point from position (x y) to position (x y) through an angle θabout rotation point (xr yr)
8
2D Rotation - derivation
cos ( ) cos cos sin sin θ φ θ φ θ φ+ = minus( ) ( ) ( ) ( )sin( ) sin cos cos sin θ φ θ φ θ φ+ = +( ) ( ) ( ) ( )
P
Q
RPX
PYφ
θ
[1][2]
[3][4]
[1] )( )( )( )( φθφθ sinsincoscos RRxQ minus=
Substituting [3] and [4] into [1] )( )( θθ sincos yPxPxQ minus=
Similarly for [2] )( )( θθ sincos xPyPyQ +=
)cos( φθ += RQ X
)sin( φθ += RQ y
)(cos φRPX = )(sin φR Py =
Rotation of point P relative to the coordinate origin
( Trigonometric identities (三角恒等式))
9
2D Rotation - derivation With the column-vector representations for coordinate positions
the rotation equations in the matrix formQ = RP
where the rotation matrix is
Therefore general equations for rotation of a point (x y) about any specified pivot ( xr yr ) (eg Fig 7-9)
10
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Rotation - derivation
cos ( ) cos cos sin sin θ φ θ φ θ φ+ = minus( ) ( ) ( ) ( )sin( ) sin cos cos sin θ φ θ φ θ φ+ = +( ) ( ) ( ) ( )
P
Q
RPX
PYφ
θ
[1][2]
[3][4]
[1] )( )( )( )( φθφθ sinsincoscos RRxQ minus=
Substituting [3] and [4] into [1] )( )( θθ sincos yPxPxQ minus=
Similarly for [2] )( )( θθ sincos xPyPyQ +=
)cos( φθ += RQ X
)sin( φθ += RQ y
)(cos φRPX = )(sin φR Py =
Rotation of point P relative to the coordinate origin
( Trigonometric identities (三角恒等式))
9
2D Rotation - derivation With the column-vector representations for coordinate positions
the rotation equations in the matrix formQ = RP
where the rotation matrix is
Therefore general equations for rotation of a point (x y) about any specified pivot ( xr yr ) (eg Fig 7-9)
10
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Rotation - derivation With the column-vector representations for coordinate positions
the rotation equations in the matrix formQ = RP
where the rotation matrix is
Therefore general equations for rotation of a point (x y) about any specified pivot ( xr yr ) (eg Fig 7-9)
10
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Scaling To change the size of object
Scaling is done by multiplying each coordinate with a scalar (Sx Sy) Uniform scaling this scalar is the same for all coordinates None-uniform scaling different scalars per coordinate
11
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Uniform scaling
2D Scaling
times 2
12
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
X times 2Y times 05
None uniform scaling
2D Scaling
13
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Scaling ndash relative to the origin Scaling relative to the origin point (0 0)
x = x˙Sx y = y˙Sy (7-10)
Sx scales objects in the x direction whileSy scales in the y direction
In matrix form
P = S ˙ P (7-12)where S is the 2 by 2 scaling matrix
(7-11)
14
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Scaling ndash relative to fixed point Scaling relative to the fixed point (xf yf)
We can rewrite these scaling transformations to
x = xf + (x ndash xf) sx y = yf + (y - yf) sy
Scaling the distance from the point to the fixed point
where the additive terms xf(1 - sx) and yf(1 - sy) are constant
bull It can be represented in the general matrix form15
Figure 7-8 Scaling relative to a chosen fixed point (xf yf ) The distance from each polygon vertex to the fixed point is scaled by Equations 7-13
(7-13)
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
1 Translation
2 Scaling
3 Rotation
General Matrix Representation
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
T
T
T
16
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
General Matrix Representation All these 2D transformations (translation scaling
rotation) can be generically described in terms of a generic matrix equation as follows
ie
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=new position original position
constant part
transformation matrix17
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Advantage amp Disadvantage
The transformation is composed of a linear combinationfollowed by a translation
Unfortunately the translation portion is not a matrixmultiplication and must be added as an extra term orvector ndash this is inconvenient
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
18
+
=
y
x
y
x
y
x
tt
PP
1001
+
=
00
00
y
x
y
x
y
x
PP
SS
+
minus=
00
cossinsincos
y
x
y
x
PP
θθθθ
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Homogeneous Coordinates(齐次坐标)
The ldquotrickrdquo we use is to add an additional component 1 to both Pand Q and also a third row and column to M consisting of zerosand a 1ie
Then all transformation equations can be expressed asmatrix multiplications
Homogeneous coordinates
=
11001y
x
y
x
y
x
PP
tdctba
+
=
y
x
y
x
y
x
tt
PP
dcba
t MP Q +=
19
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Homogeneous Coordinates Homogeneous coordinates expand 2D coordinate-
position representation (x y) to a three-elementrepresentation (xh yh h) h is a homogeneous parameter which is a nonzero value such
that
For geometric transformation we can choose any nonzerovalue for h for simplicity to set h=1
h hx yx yh h
= =
20
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Homogeneous Coordinates For translation by (tx ty)
in the abbreviated formP = T(tx ty)P
(7-17)
(7-18)
21
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
How about θ is replaced with ndashθ
Homogeneous Coordinates For rotation transformation by θ about the coordinate
origin
in the abbreviated formP = R(θ)P
The rotation transformation operator R(θ) is the 3 by 3 matrix in Eq7-19 with rotation parameter θ
(7-19)
(7-20)
22
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
For scaling transformation by sx sy relative to thecoordinate origin
in the abbreviated formP = S(sx sy)P
(7-21)
(7-22)
Homogeneous Coordinates
23
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Homogeneous Coordinates In homogeneous form
=
1001001
y
x
tt
M
=
1000000
y
x
SS
M
=
minus
10000
cossin
sincos
θθ
θθ
M
Translation by (tx ty)
Scale by Sx Sy
Rotation by θ
24
How about the inverse transformation
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Composite Transformations We can use more than one transformation operation (same type or
different) on the same object
hellip hellip
25
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Composite Translation Two successive translations (tx1 ty1) and (tx2 ty2) are applied to a
coordinate point P
where P and Prsquo are represented as homogeneous coordinate column vectors
orTwo successive translations are additive of the translation factor
++
=
sdot
1001001
1001001
1001001
21
21
1
1
2
2
yy
xx
y
x
y
x
tttt
tt
tt
( ) ( )( ) ( ) ( )( ) x y x y x y x yP T t t T t t P T t t T t t P= sdot sdot = sdot sdot2 2 1 1 2 2 1 1
( ) ( ) ( )1x y x y x x y yT t t T t t T t t t t+ +sdot =2 2 1 1 1 2 2
26
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Composite Rotation Two successive rotations with θ1 and θ2 round the origin
applied to point P
where P and Prsquo are represented as homogeneous coordinate column vectors
By multiplying the two rotation matrices we can verify that two successive rotations are additive
So that the final rotated coordinates can be calculated with the composite rotation matrix as
( ) ( ) ( 2) ( 1) ( 2) ( 1)P R θ R θ P R θ R θ P= sdot sdot = sdot sdot
)()()( 2121 θθRθRθR +=sdot
PθθRP sdot+= )( 21
+++minus+
=+1000)cos()sin(0)sin()cos(
)21( 2121
2121
θθθθθθθθ
θθRwhere
27
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
2D Composite Scaling Two successive scaling operations
Two successive scaling are multiplicative
=
1000000
1000000
1000000
21
21
1
1
2
2
yy
xx
y
x
y
x
ssss
ss
ss
)()()( 21211122 YYXXYXYX SSSSSSSSSSS sdotsdot=sdot
28
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
General 2D Pivot-Point Rotation A transformation sequence for rotating an object about a
specified pivot point
Steps Translate the object so that the pivot-point position is
moved to the coordinate origin Rotate the object about the coordinate origin Translate the object so that the pivot point is returned to its
original position29
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
General 2D Pivot-Point Rotation
Original Position of Object and Pivot Point (xr yr)
Translation of Object so that Pivot Point is at Origin
30
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
General 2D Pivot-Point Rotation
Rotation about Origin
Translation of Object so that Pivot Point is Returned to original Position
31
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
General 2D Pivot-Point Rotation Rotation with respect to a pivot point (xryr)
or in form
where
1 0 cos sin 0 1 00 1 sin cos 0 0 10 0 1 0 0 1 0 0 1
cos sin (1 cos ) sinsin cos (1 cos ) sin
0 0 1
r r
r r
r r
r r
x xy y
x yy x
θ θθ θ
θ θ θ θθ θ θ θ
minus minus sdot sdot minus
minus minus + = minus minus
( )( ) ( ) ( ) r r r r r rT x y R T x y R x yθ θsdot sdot minus minus =
1( ) ( )r r r rT x y T x yminusminus minus =32
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
General 2D Fixed-Point Scaling A transformation sequence for scaling an object with
respect to a specified fixed position using the scaling matrix
Steps Translate object so that the fixed point coincides with the coordinate
origin
Scale the object with respect to the coordinate origin
Use the inverse translation of step 1 to return the object to its original position33
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
General 2D Fixed-Point Scaling
Original Position of Object and Fixed point
Translation of Object so that Fixed Point is at Origin
34
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
General 2D Fixed-Point Scaling
Scale Object with Respect to Origin
Translation of Object so that Fixed Point is Returned to original Position
35
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
General 2D Fixed-Point Scaling Concatenating the matrices for these operations produces the
required scaling matrix
( )
( ) ( ) ( )
1 0 0 0 1 00 1 0 0 0 10 0 1 0 0 1 0 0 1
0 (1 )0 (1 )0 0 1
x y x y
f f x y
f x f
f y f
x x f
y y f
S x y s s
T x y S s s T x y
x s xy s y
s s xs s y
= sdot sdot minus minus
minus = sdot sdot minus
minus sdot = minus sdot
36
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Matrix Composition Transformations can be combined by matrix multiplication
Order of transformations Matrix multiplication is not commutative
minus
=
w
y
x
sy
sx
ty
tx
w
y
x
100
00
00
100
0cossin
0sincos
100
10
01
θθθθ
prsquo = T(txty) R(Q) S(sxsy) p
prsquo = ( T (R (Sp) ) )prsquo = ( TRS ) p
prsquo = T R S p
37
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Order of Transformations
P = R T P P = T R P
38
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
More Example Suppose we want
We have to compose two transformations
)90( degminusR )3(xT
39
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
More Example Matrix multiplication is not commutative
)3()90()90()3( xx TRRT degminusnedegminussdot
Translationfollowed by
rotation
Rotationfollowed bytranslation
40
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Chapter 7Two-Dimensional Geometric Transformations
Part IIbullOther 2D TransformationsbullRaster Methods for Geometric TransformationsbullOpenGL Raster Transformations
41
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Reflection Reflection produce a mirror image of an object
Reflection about x-axis xrsquo = x yrsquo = -y
Reflection about y-axis xrsquo = -x yrsquo = y
42
minus=
primeprime
11001
00
001
1yx
yx
minus=
primeprime
11001
00
001
1yx
yx
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Reflection Reflection about origin point (0 0)
Reflection about the line y = x and y = -x
43
minus
minus=
primeprime
11001
00
001
1yx
yx
=
primeprime
11000
01
010
1yx
yx
0 1 01 0 0
1 0 0 1 1
x xy yprime minus
prime = minus
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Shear Shear
Distorts the shape of an object such that the transformed shape appears as if the object were composed of internal layers that had been caused to slide over each other
It is done by changing the value of one coordinate and keeping the other coordinate without changing
Two types of shear To shift in x To shift in y
44Y- direction shear
X- direction shear
To stretch rectangles into parallelograms
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
X-direction Shear refer to x-axis X- direction shear
xrsquo = x + shx bull yyrsquo = y
In matrix representation
45
=
primeprime
11001
00
01
1yxsh
yx x
(7-57)
FIGURE 7-23 A unit square (a) is converted to a parallelogram (b) using the x-direction shear matrix 7-57 with shx = 2
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
X-direction Shear refer to y=yref x-direction shears relative to other reference lines y = yref
46
y=yref
y=0 y=0
minus
10010
001refy
10001001 xsh
10010
001refy
minus
=
primeprime
110010
001
10001001
10010
001
1yx
ysh
yyx
ref
x
ref
y=yref
x = x + shx(y ndash yref) y = y
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Y-direction Shear refer to y-axis Y- direction shear
x = x y = y + shy bull x
In matrix representation
47
Given shy = 2 relative to the y-axis ( x = 0) and a square with coordinates (00) (01) (11) (10)
=
primeprime
11001
0
001
1yx
shyx
y
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
y-direction shear relative to the line x = xrefx = xy = shy(x ndash xref) + y
48
Y-direction Shear refer to x=xref
Example y-direction shear relative to the line xref = -1
FIGURE 7-25 A unit square (a) is turned into a shifted parallelogram (b) with parameter values shy = 05 and xref = -1 in the y-direction shearing transformation 7-61
(7-61)
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Raster Methods for Geometric Transformations An alternative method for performing 2D transformations To use raster operations to directly manipulating pixel values in the
frame buffer
49
1 Block Transfer (bitblt pixblt) Block transfer (bitblt (bit-block transfer) pixblt) moving a block of
pixel values from one position to another
FIGURE 7-26 Translating an object from screen position (a) to the destination position shown in (b) by moving a rectangular block of pixel values Coordinate positions Pmin and Pmax specify the limits of the rectangular block to be moved and P0 is the destination reference position
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
Raster Methods for Geometric TransformationsRotations Rotations in 90 or 180 degrees are easily accomplished by
rearranging the elements of a pixel array 90deg-counterclockwise rotation by reversing the pixel values in each row
of the array 180deg-counterclockwise rotation by reversing the order of the elements in
each row then reversing the order of the rows
12 11 109 8 76 5 43 2 1
10 7 4 111 8 5 212 9 6 3
1 2 34 5 67 8 9
10 11 12
(a) (b) (c)
FIGURE 7-27 Rotating an array of pixel values The original array is shown in (a) the positions of the array elements after a 90deg counterclockwise rotation are shown in (b) and the positions of the array elements after a 180degrotation are shown in (c)50
90180
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
OpenGL Raster Transformations 1) TranslationCopyA translation of a rectangular array of pixel-color values from one buffer to
another can be accomplished in OpenGL as a copy operation
glCopyPixels (xmin ymin width height GL_COLOR)
-- GL_COLOR buffer type to be copied (others GL_DEPTH GL_STENCIL)
-- Destination Current Raster Position
The translation can be - carried out on any OpenGL buffers for refreshing- used between different bufferssource buffer is chosen with glReadBuffer destination buffer is selected with glDrawBuffer
51
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
OpenGL Raster Transformations 2) Rotation a block of pixel-color values in 90 degrees
Read a block of pixel-color values from a buffer and store in an array by glReadPixels
glReadPixels (xmin ymin width height GL_RGB GL_UNSIGNED_BYTE colorArray )
-- The color of block read into colorArray[ ] with data format GL_RGB amp data type GL_UNSIGNED_BYTE
Rearrange the rows and columns of the array Placing the rotated array back in the buffer
glDrawPixels (width height GL_RGB GL_UNSIGNED_BYTEcolorArray )
--The block is written by colorArray[ ] to Current Raster Position
52
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -
3) Scaling a block of pixel-color values
Firstly specify the scaling factors by glPixelZoomglPixelZoom ( sx sy )
-- Zoom referred to Current Raster Position-- sx sy nonzero floating-point values-- gt 10 positive values increase the size of an element in the source
array-- lt 10 positive values decrease element size-- negative value produce a reflection and scaling the array elements
Then write back (either glCopyPixels or glDrawPixels)
53
OpenGL Raster Transformations
- End of Part IampII -