Canvas knowledge summary and canvas knowledge

Canvas knowledge summary and canvas knowledge

1. Basic Knowledge

There are two ways to draw an image by using the canvas element:

Context. fill () // fill in context. stroke () // draw the border

Style: Set the style of the drawing before drawing.

Context. fillStyle // filled style context. strokeStyle // border style context. lineWidth // graphic Border Width

Context. arc (on the left of the center of centerx, the ordinate of the Center of centery, radius, start radian of startingAngle, end radian of endingAngle, and anticlockwise = 'false' clockwise, default is false)

2. Draw a non-filled Line Segment

<! DOCTYPE html> 
3. Draw a fill Image
<! DOCTYPE html> 
4. Draw an arc
<! DOCTYPE html> 
5. Draw a rectangle
<! DOCTYPE html> 
6. Draw text
<! DOCTYPE html> 
<! DOCTYPE html> 
7. Image operations
<! DOCTYPE html> 
The above is all the content of this article. I hope this article will help you in your study or work. I also hope to provide more support to the customer's home!