Drawing on the Canvas - HTML5 Canvas - page 99

FINDING THE CENTER OF ANY SHAPE
The rotation and scale of a rectangle or any other shape we draw on the canvas acts much like that of
asquare.Aslongaswearesuretotranslatetothecenterofourshapebeforewescale,rotate,orscale
and rotate, we will see the results we expect from our simple transformations. Keep in mind that the
“center” of any shape will be the x value that is half its width and the y value that is half its height.
We need to use the bounding box theory when we attempt to find this center point.
Figure 2-22 demonstrates this theory. Even though the shape is not a simple square, we have been
able to find a bounding boxthat encompasses each point ofthe object. Figure 2-22 is roughly square,
but the same theory holds for rectangle-shaped bounding boxes.
FIGURE 2-22. THE BOUNDING BOX OF A COMPLEX SHAPE