Two Dimensional Geometric Transformations

Changes in orientations, size and shape are accomplished with geometric transformations
that alter the coordinate description of objects.

Basic transformation

 Translation
 T(tx, ty)
 Translation distances
 Scale
 S(sx,sy)
 Scale factors
 Rotation
 R()
 Rotation angle
Translation

A translation is applied to an object by representing it along a straight line path

from one coordinate location to another adding translation distances, tx, ty to original
coordinate position (x,y) to move the point to a new position (x’,y’) to

x’ = x + tx, y’ = y + ty
40
The translation distance point (tx,ty) is called translation vector or shift vector.

Translation equation can be expressed as single matrix equation by using column vectors
to represent the coordinate position and the translation vector as
P  ( x, y )
T  (t x , t y )

x'  x  t x
y'  y  t y

 x '   x  t x 
 y '   y   t 
     y
P'  P  T

Moving a polygon from one position to another position with the translation
vector (-5.5, 3.75)

Rotations:

A two-dimensional rotation is applied to an object by repositioning it along a

circular path on xy plane. To generate a rotation, specify a rotation angle θ and the
position (xr,yr) of the rotation point (pivot point) about which the object is to be rotated.

Positive values for the rotation angle define counter clock wise rotation about
pivot point. Negative value of angle rotate objects in clock wise direction. The
transformation can also be described as a rotation about a rotation axis perpendicular to
xy plane and passes through pivot point

41
Rotation of a point from position (x,y) to position (x’,y’) through angle θ relative to
coordinate origin

The transformation equations for rotation of a point position P when the pivot point is at
coordinate origin. In figure r is constant distance of the point positions Ф is the original
angular of the point from horizontal and θ is the rotation angle.

The transformed coordinates in terms of angle θ and Ф

x’ = rcos(θ+Ф) = rcosθ cosФ – rsinθsinФ

y’ = rsin(θ+Ф) = rsinθ cosФ + rcosθsinФ

The original coordinates of the point in polar coordinates

x = rcosФ, y = rsinФ

the transformation equation for rotating a point at position (x,y) through an angle θ about
origin

x’ = xcosθ – ysinθ

y’ = xsinθ + ycosθ

Rotation equation

P’= R . P

Rotation Matrix

cos   sin 
R=  
 sin  cos  

42
 x' cos   sin   x 
 y '   sin  cos    y 
    

Note : Positive values for the rotation angle define counterclockwise rotations about the
rotation point and negative values rotate objects in the clockwise.

Scaling

A scaling transformation alters the size of an object. This operation can be carried out for
polygons by multiplying the coordinate values (x,y) to each vertex by scaling factor Sx &
Sy to produce the transformed coordinates (x’,y’)

x’= x.Sx y’ = y.Sy

scaling factor Sx scales object in x direction while Sy scales in y direction.

The transformation equation in matrix form

 x'  s x 0  x
 y '   0 s y   y 
  

or

P’ = S. P

Where S is 2 by 2 scaling matrix

Turning a square (a) Into a rectangle (b) with scaling factors sx = 2 and sy= 1.

Any positive numeric values are valid for scaling factors sx and sy. Values less than 1
reduce the size of the objects and values greater than 1 produce an enlarged object.

43
There are two types of Scaling. They are

Uniform scaling
Non Uniform Scaling

To get uniform scaling it is necessary to assign same value for sx and sy. Unequal values
for sx and sy result in a non uniform scaling.

Matrix Representation and homogeneous Coordinates

Many graphics applications involve sequences of geometric transformations. An

animation, for example, might require an object to be translated and rotated at each
increment of the motion. In order to combine sequence of transformations we have to
eliminate the matrix addition. To achieve this we have represent matrix as 3 X 3 instead
of 2 X 2 introducing an additional dummy coordinate h. Here points are specified by
three numbers instead of two. This coordinate system is called as Homogeneous
coordinate system and it allows to express transformation equation as matrix
multiplication

Cartesian coordinate position (x,y) is represented as homogeneous coordinate

triple(x,y,h)

• Represent coordinates as (x,y,h)

• Actual coordinates drawn will be (x/h,y/h)
For Translation

 x' 1 0 t x   x 
 y '  0 1 t   y 
   y  

 1  0 0 1   1 

P'  T t x , t y   P

For Scaling

 x'  s x 0 0  x 
 y '   0 sy 0  y 
  
 1   0 0 1  1 

P '  S s x , s y   P

44
For rotation

 x' cos  sin  0  x 

 y '   sin  cos 0  y 
  
 1   0 0 1  1 
P'  R   P

Composite Transformations

A composite transformation is a sequence of transformations; one followed by the other.

we can set up a matrix for any sequence of transformations as a composite
transformation matrix by calculating the matrix product of the individual
transformations

Translation

If two successive translation vectors (tx1,ty1) and (tx2,ty2) are applied to a coordinate
position P, the final transformed location P’ is calculated as

P’=T(tx2,ty2).{T(tx1,ty1).P}

={T(tx2,ty2).T(tx1,ty1)}.P

Where P and P’ are represented as homogeneous-coordinate column vectors.

1 0 tx2 1 0 tx1 1 0 tx1  tx2 

0 1 ty 2.0 1 ty1  0 1 ty1  ty 2
    
0 0 1  0 0 1  0 0 1 

Or

T(tx2,ty2).T(tx1,ty1) = T(tx1+tx2,ty1+ty2)

Which demonstrated the two successive translations are additive.

Rotations

Two successive rotations applied to point P produce the transformed position

P’=R(θ2).{R(θ1).P}={R(θ2).R(θ1)}.P

45
By multiplying the two rotation matrices, we can verify that two successive rotation are
additive

R(θ2).R(θ1) = R(θ1+ θ2)

So that the final rotated coordinates can be calculated with the composite rotation matrix
as

P’ = R(θ1+ θ2).P

cos 2  sin  2 0 cos1  sin  1 0 cos( 2   1)  sin( 2   1) 0

 sin  2 cos 2 0. sin  1 cos 1 0   sin( 2   1) cos( 2   1) 0
    
 0 0 1  0 0 1  0 0 1

Scaling

Concatenating transformation matrices for two successive scaling operations produces

the following composite scaling matrix

 sx2 0 0  sx1 0 0  sx2.sx1 0 0

 0 sy 2 0. 0 sy1 0   0 sy 2.sy1 0
   
 0 0 1  0 0 1  0 0 1

General Pivot-point Rotation

1. Translate the object so that pivot-position is moved to the coordinate origin

2. Rotate the object about the coordinate origin
Translate the object so that the pivot point is returned to its original position

46
The composite transformation matrix for this sequence is obtain with the concatenation

Which can also be expressed as T(xr,yr).R(θ).T(-xr,-yr) = R(xr,yr,θ)

General fixed point scaling

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 position

47
Concatenating the matrices for these three operations produces the required scaling matix

Can also be expressed as T(xf,yf).S(sx,sy).T(-xf,-yf) = S(xf, yf, sx, sy)

Note : Transformations can be combined by matrix multiplication

 x'   1 0 tx cos   sin  0 sx 0 0   x 

 y '    0 1 ty   sin  cos  0  0 sy 0   y 
       

w'  0 0 1   0 0 1  0 0 1  w

Implementation of composite transformations

#include <math.h>
#include <graphics.h>
typedef float Matrix3x3 [3][3];
Matrix3x3 thematrix;

void matrix3x3SetIdentity (Matrix3x3 m)

{
int i,j;
for (i=0; i<3; i++)
for (j=0: j<3; j++ )
m[il[j] = (i == j);
}

48
/ * Multiplies matrix a times b, putting result in b */
void matrix3x3PreMultiply (Matrix3x3 a. Matrix3x3 b)
{
int r,c:
Matrix3x3 tmp:
for (r = 0; r < 3: r++)
for (c = 0; c < 3; c++)
tmp[r][c] =a[r][0]*b[0][c]+ a[r][1]*b[l][c] + a[r][2]*b[2][c]:
for (r = 0: r < 3: r++)
for Ic = 0; c < 3: c++)
b[r][c]=- tmp[r][c]:
}

void translate2 (int tx, int ty)

{
Matrix3x3 m:
rnatrix3x3SetIdentity (m) :
m[0][2] = tx;
m[1][2] = ty:
matrix3x3PreMultiply (m, theMatrix);
}
vold scale2 (float sx. float sy, wcPt2 refpt)
(
Matrix3x3 m.
matrix3x3SetIdentity (m);
m[0] [0] = sx;
m[0][2] = (1 - sx)* refpt.x;
m[l][l] = sy;
m[10][2] = (1 - sy)* refpt.y;
matrix3x3PreMultiply (m, theMatrix);
}

void rotate2 (float a, wcPt2 refPt)

{
Matrix3x3 m;
matrix3x3SetIdentity (m):
a = pToRadians (a);
m[0][0]= cosf (a);
m[0][1] = -sinf (a) ;
m[0] [2] = refPt.x * (1 - cosf (a)) + refPt.y sinf (a);
m[1] [0] = sinf (a);
m[l][l] = cosf (a];

49
m[l] [2] = refPt.y * (1 - cosf (a) - refPt.x * sinf ( a ) ;
matrix3x3PreMultiply (m, theMatrix);
}

void transformPoints2 (int npts, wcPt2 *pts)

{
int k:
float tmp ;
for (k = 0; k< npts: k++)
{
tmp = theMatrix[0][0]* pts[k] .x * theMatrix[0][1] * pts[k].y+ theMatrix[0][2];
pts[k].y = theMatrix[1][0]* pts[k] .x * theMatrix[1][1] * pts[k].y+ theMatrix[1][2];
pts[k].x =tmp;
}
}

void main (int argc, char **argv)

{
wcPt2 pts[3]= { 50.0, 50.0, 150.0, 50.0, 100.0, 150.0};
wcPt2 refPt ={100.0. 100.0};
long windowID = openGraphics (*argv,200, 350);
setbackground (WHITE) ;
setcolor (BLUE);
pFillArea(3, pts):
matrix3x3SetIdentity(theMatrix);
scale2 (0.5, 0.5, refPt):
rotate2 (90.0, refPt);
translate2 (0, 150);
transformpoints2 ( 3 , pts)
pFillArea(3.pts);
sleep (10);
closeGraphics (windowID);

Other Transformations

1. Reflection
2. Shear

Reflection

A reflection is a transformation that produces a mirror image of an object. The mirror

image for a two-dimensional reflection is generated relative to an axis of reflection by
50
rotating the object 180o about the reflection axis. We can choose an axis of reflection in
the xy plane or perpendicular to the xy plane or coordinate origin

Reflection of an object about the x axis

Reflection the x axis is accomplished with the transformation matrix

1 0 0 
 
0  1 0 
0 0 1 
 
Reflection of an object about the y axis

Reflection the y axis is accomplished with the transformation matrix

 1 0 0 
 
0 1 0
0 0 1
 

Reflection of an object about the coordinate origin

51
Reflection about origin is accomplished with the transformation matrix

 1 0 0 
 
 0 1 0 
0 0 1
 

Reflection axis as the diagonal line y = x

To obtain transformation matrix for reflection about diagonal y=x the transformation
sequence is
1. Clock wise rotation by 450
2. Reflection about x axis
3. counter clock wise by 450

52
Reflection about the diagonal line y=x is accomplished with the transformation
matrix

0 1 0 
 
1 0 0 
0 0 1 
 

Reflection axis as the diagonal line y = -x

To obtain transformation matrix for reflection about diagonal y=-x the transformation
sequence is
1. Clock wise rotation by 450
2. Reflection about y axis
3. counter clock wise by 450

Reflection about the diagonal line y=-x is accomplished with the transformation
matrix
 0 1 0 
 
 1 0 0 
 0 0 1
 

Shear

A Transformation that slants the shape of an object is called the shear transformation.
Two common shearing transformations are used. One shifts x coordinate values and other
shift y coordinate values. However in both the cases only one coordinate (x or y)
changes its coordinates and other preserves its values.

53
X- Shear

The x shear preserves the y coordinates, but changes the x values which cause vertical
lines to tilt right or left as shown in figure

The Transformations matrix for x-shear is

1 shx 0 
 
0 1 0
0 0 1 


which transforms the coordinates as

x’ =x+ shx .y

y’ = y

Y Shear

The y shear preserves the x coordinates, but changes the y values which cause horizontal
lines which slope up or down

The Transformations matrix for y-shear is

 1 0 0 
 
shy 1 0
 0 0 1 


which transforms the coordinates as

x’ =x

y’ = y+ shy .x

54
XY-Shear

The transformation matrix for xy-shear

 x'  1 shx 0  x 
 y '   sh 1 0  y 
   y
 1   0 0 1  1 

which transforms the coordinates as

x’ =x+ shx .y

y’ = y+ shy .x

Shearing Relative to other reference line

We can apply x shear and y shear transformations relative to other reference lines. In x
shear transformations we can use y reference line and in y shear we can use x reference
line.

X shear with y reference line

We can generate x-direction shears relative to other reference lines with the
transformation matrix

1 shx  shx . yref 

0 1 0 
 
0 0 1 

which transforms the coordinates as

x’ =x+ shx (y- yref )

y’ = y

Example

Shx = ½ and yref=-1

55
Y shear with x reference line

We can generate y-direction shears relative to other reference lines with the
transformation matrix

1 shx  shx . y ref 

0 1 0 
 
0 0 1 

which transforms the coordinates as

x’ =x

y’ = shy (x- xref) + y

Example

Shy = ½ and xref=-1

56