HTML5 Guidelines for Web Developers

126 Chapter 5—Canvas

Figure 5.13 Circles and sectors

5.5.4 Rectangles

The method rect() handles a bit like our helpers, unlike the other methods:

context.rect(x, y, w, h)

In contrast to the previous path drawing methods, the current point x0/y0 is ig-

nored altogether when drawing with rect(); instead, the rectangle is defined via

the parameters x, y, width w, and height h. The origin point x/y then becomes the

new current point after drawing (see Figure 5.14).