Worksheet
for Transformations
Computer
Graphics
January 28,
2005
Two
Dimensional Transformations (Rotation, Translation, and Scaling)
There are several transformations you need to know for some of the upcoming assignments. For example, you need to know how to rotate a point with respect to a coordinate system, or to rotate the coordinate axes with respect to the point. Here we assume the rotation axis is z which is coming out of the display. Assuming the vertex P(x,y), the rotated point can be defined as P’(x’,y’). The new point can be found using the cos and sine sum formulas:
y
Clockwise
rotation is in negative direction and vs. P’ (x’,y’)
t P (x,y)
cos(a
+ b) = cos(a)cos(b) - sin(a)sin(b), and
O (0,0)
sin(a+b) = sin(a)cos(b) + sin(b)cos(a).
Then we can derive the formulas for rotating the x and y axes through an angle t and calculating the new coordinates of a point (x,y). Note that this can be done in two different ways; we can assume that the axes are rotated by t or assume that the point is rotated by that angle. There is a slight difference between the two:
When axes are rotated by t, the new point can be computed as:
_{}
If we wish to rotate the point instead (which is more common) of the
axes, we get:
Rotation of a point in positive direction by t: _{}
Of course, we then have the positive and negative rotations. A positive rotation is a counter-clockwise
rotation and a negative rotation is a clockwise rotation. In trigonometry, we learned that:
sin(-t) = sin(t) and cos(-t) = cos(t)
Thus, in the rotation matrix for rotating a point in the negative
direction only the sign for sin will change:
Rotation of a point in negative direction by t: _{}
As you perhaps have notices, it is all a matter of perspective: if we rotate the axes towards the point, then it's a positive rotation from the axes' perspective but a negative one from the point's perspective.
Example: Rotate vertex P(3,4) around the origin by 45 degree and
compute the coordinate for the new vertex. Rotation is in counter-clockwise because
angle is positive:
_{}
Scaling is similar to rotation can be
described in matrix notation:
_{}
Which represents scaling by a factor by s_{x} in x direction and by s_{y}
in the y direction.
Example: Scale the above
point by 2 and 0.5 on x and y direction respectively.
Translation can be described in two ways; either move the object away
from the view or move the viewer from the object. The common practice is to move the object
away.
_{}
Example: Translate the
above point by 2 and -4 on x and y direction respectively.