Canvas清空當前畫布方法

Canvas想要清空當前畫布的方法很簡單
使用 obj.clearRect(x,y,width,height);
四個參數意思是想要清空哪個座標點，寬高多少的畫布面積；
Canvas時鐘demo
Canvas倒計時demo
********************************************************
總結canvas
什麼是 Canvas?
HTML5 元素用於圖形的繪製，通過腳本 (通常是JavaScript)來完成.
標籤只是圖形容器，您必須使用腳本來繪製圖形。
你可以通過多種方法使用Canva繪製路徑,盒、圓、字符以及添加圖像。

    瀏覽器支持
        ie9+
        創建畫布
        <canvas id="myCanvas" width="200" height="100"></canvas>

Canvas的繪製必須在js中進行，
1.首先要獲取Canvas元素
2.創建context對象（context對象包含多種繪製路徑、矩形、圓形、字符以及添加圖像的方法
var ctx = myCanvas.getContext(‘2d’);）

Context屬性：
1.fillStyle（CSS顏色，漸變，或圖案。fillStyle默認設置是#000000（黑色））；

Canvas路徑繪製
1.moveTo(x,y) 起始位置
2.lineTo(x,y) 結束位置
3.stroke（）繪製
canvas畫圓
arc(x,y,r,start,stop)

ctx.beginPath();(初始化)
ctx.arc(95,50,40,0,2*Math.PI);
ctx.stroke();（繪製）
Canvas文本
font=’size Arial’;設置字體大小與樣式
fillText(‘文本’,x,y); 繪製實心字體
strokeText（’文本’,x,y）繪製空心字體
Canvas漸變
createLinearGradient(x,y,x1,y1) - 創建線條漸變
createRadialGradient(x,y,r,x1,y1,r1) - 創建一個徑向/圓漸變
addColorStop()方法指定顏色停止，參數使用座標來描述，可以是0至1.
例如
var grd=ctx.createLinearGradient(0,0,200,0);
grd.addColorStop(0,’red’);
grd.addColorStop(1,’white’);

ctx.fillStyle=grd;
ctx.fillRect(0,0,100,100);

鏈接起始位置與終點
closePath();