HTML5 drawing rectangles in the canvas

Ching

Original address: http://blog.csdn.net/qingdujun/article/details/32930501

First, draw the rectangle

The canvas uses the origin (0,0) coordinate system in the upper-left corner, the x-coordinate is incremented to the right, and the y-coordinate is incremented downward.

Draws a rectangle using the rectangle drawing function of the drawing environment.

• FillRect (x,y,width,height) : Draws a solid rectangle.
• Strokerect (x,y,width,height) : Draws a hollow rectangle.
• Clearrect (x,y,width,height) : Clears the specified rectangular area so that it is completely transparent.

Second, draw a rectangle in the canvas

<!--<! The doctype> declaration must be the first line in the HTML document, before the 
Third, the effect of drawing

References: (India) Xiang Card (SHANKAR,A.R.) (author). She Guanglei (translator). HTML5 Game Development Advanced Guide [M]. Beijing: Electronic industry Press, 2013.3-5.