Transforming co-ordinates from a rectangle to a parallelogram

Question

Hi all, I am stuck on a simple yet vexing problem with basic geometry. Too bad I don;t remember my high-school co-ordinate geometry and looking for some help.

My problem is illustrated in this diagram:

I am struggling with transforming a co-ordinate from the rectangle to a resized parallelogram. Any tips, pointers and/or code-examples would be wonderful!

Thanks, M.

Answer 1

There are several steps in this transformation.

1. Scale about (x,y) to adjust to the final size W', H'. (Possibly unequal scaling on X and Y axes).
2. Apply a shear transform to convert the rectangle to a parallelogram (keeping x,y invariant).
3. Rotate about (x,y) to align to the final coordinate orientation.
4. Translate to the new location.

Create the coordinate matrices for each of these and composite (multiply) them together to create the overall transform. Wikipedia could be your starting point to know about these transformation matrices.

Tip: Might be simplest to apply a translation to move (x,y) to the origin first. Then, the shear, scaling and rotation are a lot simpler to do. Then move it to the new location.