Html5 canvas clearing method (3) and html5 canvas emptying method (3)

Html5 canvas clearing method (3) and html5 canvas emptying method (3)

To sum up the following three ways to clear the canvas:

1. The simplest method is to clear the canvas content whenever the height or width of the canvas is reset. You can use the following methods to clear the canvas content:

Function clearCanvas <span style = "font-family: Verdana, Arial, ;"> () </span> {var c = document. getElementById ("myCanvas"); var cxt = c. getContext ("2d"); c. height = c. height ;}

2. Use the clearRect method:

Function clearCanvas () {var c = document. getElementById ("myCanvas"); var cxt = c. getContext ("2d"); cxt. clearRect (0, 0, c. width, c. height );}

3. Similar to method 2, you can fill the canvas with a specific color to clear the canvas:

Function clearCanvas () {var c = document. getElementById ("myCanvas"); var cxt = c. getContext ("2d"); cxt. fillStyle = "#000000"; cxt. beginPath (); cxt. fillRect (0, 0, c. width, c. height); cxt. closePath ();}

The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.