Module 2

MODULE - II
• 2D and 3D graphics with OpenGL: 2D Geometric Transformations:
Basic 2D Geometric Transformations, matrix representations and
homogeneous coordinates, 2D Composite transformations, other 2D
transformations, raster methods for geometric transformations,
OpenGL raster transformations, OpenGL geometric transformations
functions
• 3D Geometric Transformations: Translation, rotation, scaling,
composite 3D transformations, other 3D transformations, OpenGL
geometric transformations functions
• Color models: color model, RGB color model, CMY color model
Transformations
• Transformation means changing some graphics into something else
by applying rules.
• We can have various types of transformations such as translation,
scaling up or down, rotation, shearing, etc.
• When a transformation takes place on a 2D plane, it is called 2D
transformation.
• Transformations play an important role in computer graphics
to reposition the graphics on the screen and change their
size or orientation.
Basic Two-Dimensional Geometric
Transformations
• Geometric transformations ?
• Operations that are applied to the geometric description of an object to change its
position, orientation, or size are called geometric transformations.
• The geometric-transformation functions that are available in all graphics packages
are
• 1. Translation,
• 2. Rotation, and
• 3. Scaling
• Other useful transformation
• routines that are sometimes included in a package are reflection and shearing operations.
2D Translation in Computer Graphics
•2D Translation is a process of moving an object from one position
to another in a two dimensional plane.
•Consider a point object O has to be moved from one position to
another in a 2D plane.
•Let-
• Initial coordinates of the object O = (Xold, Yold)
• New coordinates of the object O after translation = (Xnew, Ynew)
Translation vector or Shift vector = (Tx, Ty)
• Given a Translation vector (Tx, Ty)-
• Tx defines the distance the Xold coordinate has to be moved. Ty defines the distance the Yold
coordinate has to be moved.
 In Matrix form, the above translation
equations may be represented as-

This translation is achieved by adding the translation

coordinates to the old coordinates of the object as-
• Xnew = Xold + Tx (This denotes translation towards X
axis)
•Ynew = Yold + Ty (This denotes translation towards Y axis)
• Given a square with coordinate points A(0, 3), B(3, 3), C(3, 0), D(0, 0).
Apply the translation with distance 1 towards X axis and 1 towards Y
axis. Obtain the new coordinates of the square.
Solution-

Given-
•Old coordinates of the square = A (0, 3), B(3, 3), C(3, 0),
D(0, 0)
•Translation vector = (Tx, Ty) = (1, 1)

For Coordinates A(0, 3) For Coordinates B(3, 3)

Let the new coordinates of corner A = (Xnew, Ynew). Let the new coordinates of corner B = (Xnew, Ynew).

Applying the translation equations, we have- Applying the translation equations, we have-
•Xnew = Xold + Tx = 0 + 1 = 1 •Xnew = Xold + Tx = 3 + 1 = 4
•Ynew = Yold + Ty = 3 + 1 = 4 •Ynew = Yold + Ty = 3 + 1 = 4

•Thus, New coordinates of corner A = (1, 4).

Thus, New coordinates of corner B = (4,2148).
For Coordinates C(3, 0)
Let the new coordinates of corner C = (Xnew, Ynew). Applying

the translation equations, we have-

•Xnew = Xold + Tx = 3 + 1 = 4 For Coordinates D(0, 0)

•Ynew = Yold + Ty = 0 + 1 = 1
Let the new coordinates of corner D = (Xnew, Ynew).
Thus, New coordinates of corner C = (4, 1).
Applying the translation equations, we have-
•Xnew = Xold + Tx = 0 + 1 = 1
•Ynew = Yold + Ty = 0 + 1 = 1

Thus, New coordinates of corner D = (1, 1).

Thus, New coordinates of the square = A (1,

4), B(4, 4), C(4, 1), D(1, 1).
PRACTICE PROBLEMS BASED ON 2D
Translation
• Given a circle C with radius 10 and center coordinates (1, 4). Apply the
translation with distance 5 towards X axis and 1 towards Y axis. Obtain
the new coordinates of C without changing its radius.
•Solution-

•Given-
•Old center coordinates of C = (Xold, Yold) = (1, 4)
•Translation vector = (Tx, Ty) = (5, 1)
•Let the new center coordinates of C = (Xnew, Ynew). Applying

the translation equations, we have-

•Xnew = Xold + Tx = 1 + 5 = 6
•Ynew = Yold + Ty = 4 + 1 = 5

•Thus, New center coordinates of C = (6, 5).

 Translation
class wcPt2D {
public: GLfloat x, y;
};
void translatePolygon (wcPt2D * verts, GLint nVerts, GLfloat tx,
GLfloat ty)
{
GLint k;
for (k = 0; k < nVerts; k++)
{
verts [k].x = verts [k].x + tx;
verts [k].y = verts [k].y + ty;
}
glBegin (GL_POLYGON);
for (k = 0; k < nVerts; k++)
glVertex2f (verts [k].x, verts [k].y);
glEnd ( );
}
 2D Rotation in Computer Graphics
• 2D Rotation is a process of rotating an object with respect to an angle
in a two dimensional space.
•Consider a point object O has to be rotated from one angle to another in a 2D
plane.
•Let-
•Initial coordinates of the object O = (Xold, Yold)
•Initial angle of the object O with respect to origin = Φ
•Rotation angle = θ
•New coordinates of the object O after rotation = (Xnew, Ynew)
•This rotation is achieved by using the following rotation equations-
•Xnew = Xold x cosθ – Yold x sinθ
•Ynew = Xold x sinθ + Yold x cosθ

•In Matrix form, the above rotation equations may be represented as shown
above
2D Rotation about the origin.

P’(x’,y’)

P(x,y)
x = r.cosφ
r
y = r.sinφ
θ y
r
φ
x
2D Rotation about the origin.
′
x = r.cos(θ+φ) = r.cosφ.cosθ− r.sinφ.sinθ
′
y y = r.sin(θ+φ) = r.cosφ.sinθ+ r.sinφ.cosθ

P’(x’,y’)

P(x,y)
r x = r.cosφ
y = r.sinφ
θ y
r
φ
x
x
 ′
x = r.cos(θ+φ) = r.cosφ.cosθ− r.sinφ.sinθ
′
y = r.sin(θ+φ) = r.cosφ.sinθ+ r.sinφ.cosθ
′ ′
Substituting for r x = x.cosθ− y.sinθ y
= x.sinθ+ y.cosθ
x = r.cosφ
y = r.sinφ Rewriting in matrix form gives us :
Gives us : ′
x ⎢ cosθ − sinθ⎥.⎢ x⎥
⎡ ⎤ = ⎡sinθ cosθ ⎤ ⎡y ⎤
′
x = x.cosθ− y.sinθ ⎢⎣ ⎥⎦
′ y′ ⎣ ⎦ ⎣ ⎦
y = x.sinθ+ y.cosθ

⎡cosθ − sinθ
Define the matrix R = ⎢ ⎤, ′
⎥⎦ P = R ⋅
⎣sinθ cosθ
P
• Given a line segment with starting point as (0, 0) and ending point as
(4, 4). Apply 30 degree rotation anticlockwise direction on the line
segment and find out the new coordinates of the line.
Solution-
Applying the rotation equations, we have-
We rotate a straight line by its end points with the same
angle. Then, we re-draw a line between the new end X
new
points. = Xold x cosθ – Yold x sinθ
= 4 x cos30º – 4 x sin30º
Given- = 4 x (√3 / 2) – 4 x (1 / 2)
• Old ending coordinates of the line = (Xold, Yold) = (4, 4) = 2√3 – 2
•Rotation angle = θ = 30º = 2(√3 – 1)
= 2(1.73 – 1)
= 1.46
Let new ending coordinates of the line after rotation
= (Xnew, Ynew).
 Y
new
= Xold x sinθ + Yold x cosθ
= 4 x sin30º + 4 x cos30º
= 4 x (1 / 2) + 4 x (√3 / 2)
= 2 + 2√3
= 2(1 + √3)
= 2(1 + 1.73)
= 5.46
Thus, New ending coordinates of the line after rotation
= (1.46, 5. 46).

Assignment:
Given a triangle with corner coordinates (0, 0), (1, 0) and (1,
1). Rotate the triangle by 90 degree anticlockwise direction
and find out the new coordinates.
Rotation of a point about an arbitrary pivot position
class wcPt2D {
public: GLfloat x, y;
};
void rotatePolygon (wcPt2D * verts, GLint nVerts, wcPt2D pivPt,
GLdouble theta)
{
wcPt2D * vertsRot;
GLint k;
for (k = 0; k < nVerts; k++) {
vertsRot [k].x = pivPt.x + (verts [k].x - pivPt.x) * cos
(theta) - (verts [k].y - pivPt.y) * sin (theta);
vertsRot [k].y = pivPt.y + (verts [k].x - pivPt.x) * sin
(theta) + (verts [k].y - pivPt.y) * cos (theta);
}
glBegin {GL_POLYGON};
for (k = 0; k < nVerts; k++)
glVertex2f (vertsRot [k].x, vertsRot [k].y);
glEnd ( );
}
2D Scaling in Computer Graphics-
• In computer graphics, scaling is a process of modifying or altering the size
of objects.
• Scaling may be used to increase or reduce the size of object.

• Scaling subjects the coordinate points of the original object to change.

• Scaling factor determines whether the object size is to be increased or

reduced.

• If scaling factor > 1, then the object size is increased.

• If scaling factor < 1, then the object size is reduced.

•Consider a point object O has to be scaled in a 2D plane.
Let-
•Initial coordinates of the object O = (Xold, Yold)
•Scaling factor for X-axis = Sx
•Scaling factor for Y-axis = Sy
•New coordinates of the object O after scaling = (Xnew, Ynew)
•This scaling is achieved by using the following scaling equations-
•Xnew = Xold x Sx
•Ynew = Yold x Sy
Matrix Representations and Homogeneous
Coordinates
• To combine these three transformations into a single transformation,
homogeneous coordinates are used.
• In homogeneous coordinate system, two-dimensional coordinate
positions (x, y) are represented by triple-coordinates.
• Homogeneous coordinates are generally used in design and
construction applications. Here we perform translations, rotations,
scaling to fit the picture into proper position.
• Each of the three basic two-dimensional transformations (translation,
rotation, and scaling) can be expressed in the general matrix form

• With coordinate positions P and P’ represented as column vectors.

• Matrix M1 is a 2 × 2 array containing multiplicative factors, and M2 is a
two-element column matrix containing translational terms.

• For translation, M1 is the identity matrix.

• For rotation or scaling, M2 contains the translational terms associated
with the pivot point or scaling fixed point.
• Multiplicative and translational terms for a two-dimensional
geometric transformation can be combined into a single matrix if
we expand the representations to 3 × 3 matrices
• We can use the third column of a transformation matrix for the translation
terms, and all transformation equations can be expressed as matrix
multiplications.
• We also need to expand the matrix representation for a
two-dimensional coordinate position to a three-element column
matrix
Two-Dimensional Translation Matrix
• Thehomogeneous-coordinate for translation is given by

• This translation matrix is abbreviated as

Two-Dimensional Rotation Matrix
• Two-dimensional rotation transformation equations about the
coordinate origin can be expressed in the matrix form

✔ The rotation transformation operator R(θ ) is the 3 × 3 matrix with rotation parameter θ.
Two-Dimensional Scaling Matrix
• A scaling transformation relative to the coordinate origin can
now be expressed as the matrix multiplication

• The scaling operator S(sx, sy ) is the 3 × 3 matrix with parameters sx and sy

Inverse Transformations
• For translation, we obtain the inverse matrix by negating the
translation distances. Thus, if we have two-dimensional translation
distances tx and ty, the inverse translation matrix is
• An inverse rotation is accomplished by replacing the rotation angle
by its negative.
• A two-dimensional rotation through an angle θ about the
coordinate origin has the inverse transformation matrix
• We form the inverse matrix for any scaling transformation by
replacing the scaling parameters with their reciprocals. the inverse
transformation matrix is
 Two-Dimensional Composite
Transformations
• Matrix to represent sequence of transformations
• P = M2 · M1 · P = M · P
Composite Two-Dimensional Translations

• P = T(t2x, t2y) · {T(t1x, t1y) · P} = {T(t2x, t2y) · T(t1x, t1y)} · P

Composite Two-Dimensional Rotations
• P = R(θ2) · {R(θ1) · P} = {R(θ2) · R(θ1)} · P
• R(θ2) · R(θ1) = R(θ1 + θ2)
• P = R(θ1 + θ2) · P
• Composite Two-Dimensional Scalings
General Two-Dimensional Pivot-Point Rotation
• We can generate a two-dimensional rotation about any other pivot
point (xr , yr ) by performing the following sequence of translate-
rotate-translate operations:
• 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 position.
• T(xr, yr)· R(θ)·T(−xr, −yr) = R(xr, yr, θ)
General Two-Dimensional Fixed-Point Scaling
To produce a two-dimensional scaling with respect to a selected fixed
position (x f , yf ), when we have a function that can scale relative to the
coordinate origin only. This sequence is
• Translate the object so that the fixed point coincides with the
coordinate origin.
• Scale the object with respect to the coordinate origin.
• Use the inverse of the translation in step (1) to return the object to
its original position.
General Two-Dimensional Scaling Directions
• to apply scaling factors with values specified by parameters s1 and s2
in the directions shown in Figure
A square (a) is converted to a parallelogram (b) using the
composite transformation matrix 39, with s1 = 1, s2 = 2, and θ =
45◦
Matrix Concatenation Properties

Property 1:

• Multiplication of matrices is associative.

• For any three matrices,M1, M2, andM3, the matrix product M3 · M2 · M1

can be performed by first multiplying M3 and M2 or by first
multiplyingM2 and M1:

• M3 · M2 · M1 = (M3 · M2) · M1 = M3 · (M2 · M1)

• We can construct a composite matrix either by multiplying from left to

right (premultiplying) or by multiplying from right to left (postmultiplying)
`
Property 2:
• Transformation products may not be commutative
• M2 · M1 may not be equal to M1 · M2
 General Two-Dimensional Composite
Transformations and Computational Efficiency

• For example, if an object is to be scaled and rotated about its centroid

(xc , yc ), elements of the composite transformation matrix are:

The explicit calculations for the transformed coordinates are

• In animations and other applications that involve many repeated
transformations and small rotation angles, we can use approximations and
iterative calculations to reduce computations in the composite
transformation equations. These rotation calculations are:

The accumulated error over many steps can become quite large. The
object positions are reset when error accumulation becomes large.
Some animation applications automatically reset object positions at fixed
intervals (eg. 360 or 180 degrees)
Two-Dimensional Rigid-Body Transformation
• If a transformation matrix includes only translation and rotation
parameters, it is a rigid-body transformation matrix.

• Each vector has unit length as follows

• Also
• Transformation to rotate an object through an angle θ about a pivot
point (xr, yr) and then translate the object
 Other Two-Dimensional Transformations
• Reflection
Reflection in computer graphics is used to
emulate reflective objects like mirrors and shiny
surfaces

• Shear
Shearing deals with changing the shape and size of the
2D object along x-axis and y-axis

It is an ideal technique to change the shape of an existing

object in a two dimensional plane
 Reflection

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

• For a two-dimensional reflection, this image is generated relative to an axis of reflection by
rotating the object 180◦ about the reflection axis.
• Reflection about the line y = 0 (the x axis) is accomplished with the transformation Matrix
✔ This transformation retains x values, but “flips” the y values
of coordinate positions.
✔ The resulting orientation of an object after it has been
reflected about the x axis is shown in Figure

Problem:
Find the reflection of the triangle (1,1), (1,2),(3,1)
about the x axis
• Figure below illustrates the change in position of an object that
has been reflected about the line x = 0.

✔ A reflection about the line x = 0 (the y axis) flips x

coordinates while keeping y coordinates the same. The
matrix for this transformation is

Problem:
Find the reflection of the triangle (1,1), (1,2),(3,1)
about the y axis

53
 ✔ We flip both the x and y coordinates of a point by reflecting
relative to an axis that is perpendicular to the xy plane and that
passes through the coordinate origin the matrix representation
for this reflection is

Problem:
Find the reflection of the triangle (1,1), (1,2),(3,1)
about this plane
• An example of reflection about the origin is shown in
Figure

✔ If we choose the reflection axis as the diagonal line y = x

(Figure below), the reflection matrix is

✔ To obtain a transformation matrix for reflection about the diagonal y = −x,

we could concatenate matrices for the transformation sequence:
(1) clockwise rotation by 45◦,
(1) reflection about the y axis, and
(2) counterclockwise rotation by 45◦.
The resulting transformation matrix is
 Shear
• A transformation that 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 is called a shear.

• Two common shearing transformations are those that shift coordinate x values and
those that shift y values. An x-direction shear relative to the x axis is produced
with the transformation Matrix

which transforms coordinate positions as

• Any real number can be assigned to the shear parameter shx Setting parameter shx
to the value 2, for example, changes the square into a parallelogram is shown
below. Negative values for shx shift coordinate positions to the left.

A unit square (a) is converted to a parallelogram (b) using the x

-direction shear with shx = 2.

✔ We can generate x-direction shears relative to other

reference lines with

✔ A y-direction shear relative to the line x = xref is generated

Now, coordinate positions are transformed as
with the transformation Matrix

which generates the transformed coordinate values

57
Raster methods for geometric Transformations
Raster methods for geometric Transformations
• Raster systems store picture information as color patterns in the frame buffer.
• Therefore, some simple object transformations can be carried out rapidly by manipulating an array of
pixel values
• Few arithmetic operations are needed, so the pixel transformations are particularly efficient.
• Functions that manipulate rectangular pixel arrays are called raster operations and moving a block of
pixel values from one position to another is termed a block transfer, a bitblt, or a pixblt.

• Figure illustrates a two-dimensional translation

implemented as a block transfer of a refresh-buffer area
✔ Rotations in 90-degree increments are accomplished easily by rearranging the elements of a pixel array.
✔ We can rotate a two-dimensional object or pattern 90◦ counterclockwise by reversing the pixel values in
each row of the array, then interchanging rows and columns.

✔ A 180◦ rotation is obtained by reversing the order of the elements in each row of the array, then reversing
the order of the rows.
✔ Figure below demonstrates the array manipulations that can be used to rotate a pixel block by 90◦ and by
180◦.
✔ For array rotations that are not multiples of 90◦, we need to do some extra
processing.
✔ The general procedure is illustrated in Figure below.

✔ Each destination pixel area is mapped onto

the rotated array and the amount of overlap
with the rotated pixel areas is calculated.
✔ A color for a destination pixel can then
be computed by averaging the colors of
the overlapped source pixels, weighted
by their percentage of area overlap.
✔ Pixel areas in the original block are scaled, using specified values for sx and sy, and
then mapped onto a set of destination pixels.
✔ The color of each destination pixel is then assigned according to its area of overlap
with the scaled pixel areas
OpenGL Raster Transformations
• A translation of a rectangular array of pixel-color values from one
buffer area to another can be accomplished in OpenGL as the
following copy operation:
glCopyPixels (xmin, ymin, width, height, GL_COLOR);
• Copy the array of pixels to a rectangular area of a refresh
buffer whose lower-left corner is at xmin, ymin.
• The first four parameters in this function give the location and
dimensions of the pixel block; and the OpenGL symbolic
constant GL_COLOR specifies that it is color values are to be
copied.
 ❖ A block of RGB color values in a buffer can be saved in an array with the function
glReadPixels (xmin, ymin, width, height, GL_RGB, GL_UNSIGNED_BYTE, colorArray);
❖ If color-table indices are stored at the pixel positions, we replace the constant GL_RGB with
GL_COLOR_INDEX.

❖ To rotate the color values, we rearrange the rows and columns of the color array, as described in the
previous section. Then we put the rotated array back in the buffer with
glDrawPixels (width, height, GL_RGB, GL_UNSIGNED_BYTE, colorArray);

❖ A two-dimensional scaling transformation can be performed

as a raster operation in OpenGL by specifying scaling
factors and then invoking either gl Copy Pixels or
❖ We can also combine raster transformations
▪ glDrawPixels.
with logical operations to produce various
❖ For the raster operations, we set the scaling factors with
effects with the exclusive or operator
glPixelZoom (sx, sy);
OpenGL Functions for Two-Dimensional
Geometric Transformations
•A 4× 4 translation matrix is constructed with the following routine:
glTranslate*(tx, ty, tz);
• the single suffix code to be affixed to this function is either f (float) or
d (double).
• tx, ty, and tz can be assigned any real-number values
• For two-dimensional applications, we set tz = 0.0; and a
two-dimensional position is represented as a four-element column
matrix with the z component equal to 0.0
• example: glTranslatef (25.0, -10.0, 0.0);
 🡪 Similarly, a 4 × 4 rotation matrix is generated with
glRotate* (theta, vx, vy, vz);
🡪 where the vector v = (vx, vy, vz) can have any floating-point values for its
components.
✔ This vector defines the orientation for a rotation axis that passes through the
coordinate origin.
If v is not specified as a unit vector, then it is normalized automatically before the
elements of the rotation matrix are computed
Rotation in two-dimensional systems is rotation about the z axis, specified as a unit
vector with x and y components of zero, and a z component of 1.0
✔ The suffix code can be either f or d, and parameter theta is to be
assigned a rotation angle in degree.

✔ For example, the statement: glRotatef (90.0, 0.0, 0.0, 1.0);

🡪 We obtain a 4 × 4 scaling matrix with respect to the coordinate origin with
the following routine: glScale* (sx, sy, sz);
✔ The suffix code is again either f or d, and the scaling parameters can
be assigned any real-number values.
✔ Scaling in a two-dimensional system involves changes in the x and y
dimensions, so a typical two-dimensional scaling operation has a z
scaling factor of 1.0
✔ Example: glScalef (2.0, -3.0, 1.0);
✔ Note: A zero value for any scaling parameter can cause a processing
error
To illustrate this ordering, we initialize the modelview matrix with the following code

glMatrixMode (GL_MODELVIEW); Indicates Geometric Transformation

GLfloat elems [16]; a call to a transformation routine generates a matrix
that is multiplied by the current matrix for that mode
GLint k;

for (k = 0; k < 16; k++)

glLoadIdentity ( );
elems [k] = float (k);
The above statement can be used if we want to use identity
glLoadMatrixf (elems); matrix instead of assigning values to the current matrix
Which produces the matrix
✔ We can also concatenate a specified matrix with the current
▪ matrix as follows: glMultMatrix* (otherElements16);
✔ Again,thesuffixcodeiseither ford,andparamet
er
otherElements16 is a 16-element, single-subscripted array that lists
▪ the elements of some other matrix in column-major order.
✔ Thus, assuming that the current matrix is the modelview matrix,
▪ which we the
M, then designate
updatedasmodelview matrix is
computed as M = M· M’
OpenGL Matrix Operations
✔ The glMatrixMode routine is used to set the projection
mode which designates the matrix that is to be used for ✔ With the following function, we assign the identity
▪ the projection transformation. ▪ matrix to the current matrix: glLoadIdentity ( );
✔ We specify the modelview mode with the statement
✔ Alternatively, we can assign other values to the elements
glMatrixMode (GL_MODELVIEW);
of the current matrix using glLoadMatrix*
🕐 which designates the 4×4 modelview matrix as the
current matrix ▪ (elements16);
🕐 Two other modes that we can set with the ✔ A single-subscripted, 16-element array of floating-point
glMatrixMode function are the texture mode and the values is specified with parameter elements16, and a suffix
color mode.
▪ code of either f or d is used to designate the data type
🕐 The texture matrix is used for mapping texture ✔ The elements in this array must be specified in column-
patterns to surfaces, and the color matrix is used to major order
convert from one color model to another.
🕐 The default argument for the glMatrixMode
function is GL_MODELVIEW.
71
✔ The glMultMatrix function can also be used to set up any transformation sequence with individually
defined matrices.
✔ For example,
glMatrixMode (GL_MODELVIEW);
glLoadIdentity ( ); // Set current matrix to the identity.
glMultMatrixf (elemsM2); // Postmultiply identity with matrix M2.
glMultMatrixf (elemsM1); // Postmultiply M2 with matrix M1.

produces the following current modelview matrix:

M = I · M2 · M1 = M2 · M1
glMatrixMode (GL_MODELVIEW);
glColor3f (0.0, 0.0, 1.0);
glRecti (50, 100, 200, 150); // Display blue rectangle.
glColor3f (1.0, 0.0, 0.0);
glTranslatef (-200.0, -50.0, 0.0); // Set translation parameters.
glRecti (50, 100, 200, 150); // Display red, translated rectangle.
glLoadIdentity ( ); // Reset current matrix to identity.
glRotatef (90.0, 0.0, 0.0, 1.0); // Set 90-deg. rotation about z-axis.
glRecti (50, 100, 200, 150); // Display red, rotated rectangle.
glLoadIdentity ( ); // Reset current matrix to identity.
glScalef (-0.5, 1.0, 1.0); // Set scale-reflection parameters.
glRecti (50, 100, 200, 150); // Display red, transformed rectangle
3D Geometric Transformations
1. Translation,

2. Rotation,

3. Scaling,

4. Composite 3D Transformations
•Three-Dimensional Translation
A position P = (x, y, z) in three-dimensional space is translated to a
location P’= (x’, y’, z’) by adding translation distances tx, ty, and tz to
the Cartesian coordinates of P:

x’= x+tx,
y’ = y+ty,
z’ = z+tz
 The following program segment illustrates construction of a
translation matrix, given an input set of translation parameters.
typedef GLfloat Matrix4x4 [4][4]; /* Construct the 4 x 4 identity matrix. */
void matrix4x4SetIdentity (Matrix4x4 matIdent4x4)
{
GLint row, col;
for (row = 0; row < 4; row++)
for (col = 0; col < 4 ; col++)
matIdent4x4 [row][col] = (row == col);
}
void translate3D (GLfloat tx, GLfloat ty, GLfloat tz)
{
Matrix4x4 matTransl3D; /* Initialize translation matrix to identity. */
matrix4x4SetIdentity (matTransl3D);
matTransl3D [0][3] = tx;
matTransl3D [1][3] = ty;
matTransl3D [2][3] = tz;
}
 Three-Dimensional Rotation
• positive rotation angles produce counterclockwise rotations about a
coordinate axis when looking along the positive half of the axis toward
the origin.
Three-Dimensional Coordinate-Axis Rotations
 Three-Dimensional Coordinate-Axis
Rotations ‘
‘
‘
‘
Along z axis ‘
‘

x' = x cos θ − y sin θ

y’ = x sin θ + ycos θ
z' = z
‘
‘
‘

✔ Transformation equations for rotations about the other two coordinate axes can be obtained with a
cyclic permutation of the coordinate parameters x, y, and z

x → y→ z→ x
 General Three-Dimensional Rotations
• To rotate an object about an axis that is parallel to one of
the coordinate axes, the following 3 steps are
performed:
1. Translate the object so that the rotation axis coincides with
the parallel coordinate axis.
2. Perform the specified rotation about that axis.
3. Translate the object so that the rotation axis is moved back to
its original position.
For a coordinate position P,
If an object is to be rotated about an axis that is not parallel to one of
the coordinate axes, we must perform the following 5 steps:

• Translate the object so that the rotation axis passes through the
coordinate origin.
• Rotate the object so that the axis of rotation coincides with one of the
coordinate axes.
• Perform the specified rotation about the selected coordinate axis.
• Apply inverse rotations to bring the rotation axis back to its original
orientation.
• Apply the inverse translation to bring the rotation axis back to its original
spatial position
Scaling
• The matrix expression for the three-dimensional scaling
transformation of a position P = (x, y, z) is given by

i.e.
x' = x · sx, y’ = y · sy, z’ = z · sz

• The three-dimensional scaling transformation for a point position can

be represented as
P’ = S · P
• Because some graphics packages provide only a routine that scales
relative to the coordinate origin, we can always construct a scaling
transformation with respect to any selected fixed position (xf , yf , zf )
using the following transformation sequence:

– Translate the fixed point to the origin.

– Apply the scaling transformation relative to the coordinate origin

– Translate the fixed point back to its original position.

A sequence of
transformations for scaling
an object relative to a
selected fixed point
The matrix representation for an arbitrary fixed-point scaling can then be
expressed as the concatenation of these translate-scale-translate
transformations:

The following code demonstrates the direct construction of a

three-dimensional scaling matrix relative to a selected fixed point using
the calculations
class wcPt3D {
private: GLfloat x, y, z;
wcPt3D ( ) {
x = y = z = 0.0;
}
setCoords (GLfloat xCoord, GLfloat yCoord, Glfloat zCoord) {
x = xCoord;
y = yCoord;
z = zCoord;
}
GLfloat getx ( ) const {
return x;
}
GLfloat gety ( ) const {
return y;
}
GLfloat getz ( ) const {
return z;
class wcPt3D {
private: GLfloat x, y, z;
wcPt3D ( ) {
x = y = z = 0.0;
}
setCoords (GLfloat xCoord, GLfloat yCoord, Glfloat zCoord) {
x = xCoord;
y = yCoord;
z = zCoord;
}
GLfloat getx ( ) const {
return x;
}
GLfloat gety ( ) const {
return y;
}
GLfloat getz ( ) const {
return z;
}
};
typedef float Matrix4x4 [4][4];
void scale3D (GLfloat sx, GLfloat sy, GLfloat sz, wcPt3D
fixedPt) {
Matrix4x4 matScale3D;
/* Initialize scaling matrix to identity. */
matrix4x4SetIdentity (matScale3D); To create an identity matrix
(discussed in previous slide)
matScale3D [0][0] = sx;
matScale3D [0][3] = (1 - sx) * fixedPt.getx ( );
matScale3D [1][1] = sy;
matScale3D [1][3] = (1 - sy) * fixedPt.gety ( );
matScale3D [2][2] = sz;
matScale3D [2][3] = (1 - sz) * fixedPt.getz ( );
}
Composite Transformations
• A number of transformations or sequence of transformations can be
combined into single one called as composition. The resulting matrix is
called as composite matrix. The process of combining is called as
concatenation.
• To perform rotation about an arbitrary point, sequence of
transformations:
Translation 🡪 Rotation 🡪 Reverse Translation
• The ordering sequence of these transformations must not be changed.
• If a matrix is represented in column form, then the composite
transformation is performed by multiplying matrix in order from right to
left side.
 Example showing composite
transformations:
The enlargement is with respect to center. For this following sequence of
transformations will be performed and all will be combined to a single
one
Step1: The object is kept at its position as in fig (a)
Step2: The object is translated so that its center coincides with the origin as
in fig (b)
Step3: Scaling of an object by keeping the object at origin is done in fig (c)
Step4: Again translation is done. This second translation is called a reverse
translation. It will position the object at the origin location.
Above transformation can be represented as TV.STV-1