1，绘制直线：
设定起点：moveTo(x坐标，y坐标),
设定终点：lineTo(x坐标，y坐标)
开始绘制：stroke()
新的路径： beginPath();
封闭路径：closePath();
裁切图形：clip();
2，绘制矩形：
方法一：
c.moveTo(0,0);
c.lineTo(0,200);
c.lineTo(200,200);
c.lineTo(200,0);
c.closePath();
c.stroke();
方法二：
c.rect(x,y,w,h);
c.stroke();
方法三：
strokeRect();
3，绘制填充矩形：
方法一：
c.beginPath();
c.fillStyle="yellow";
c.rect(300,250,150,150);
c.fill(); //填充图形
c.stroke();
方法二：
c.beginPath();
c.fillStyle="green"; //填充颜色
c.fillRect(500,400,150,150);
4，绘制圆/弧：
arc（x,y,r,开始角度，结束角度，true/false）：创建圆弧/曲线（用于创建圆形或部分圆）
true/false ：逆时针/顺时针
arcTo(x1,y1,x2,y2,r) 方法在画布上创建介于两个切线之间的弧/曲线
eg1：
c.arc(150,50,130,0,Math.PI); //Math.PI代表弧度，换算成角度为180度
c.stroke();
//画圆形
function drawCircle(x,y,r){
c.beginPath();
for(var i=0;i<360;i++){
c.lineTo(x+r*Math.cos(i*Math.PI/180),y+r*Math.sin(i*Math.PI/180)); //圆上的点
c.stroke();
}
}
5，绘制扇形：
c.fillStyle="yellow";
c.strokeStyle="#a9a9a9";
c.lineWidth=2;
c.beginPath();
c.moveTo(300,300);
c.arc(300,300,200,Math.PI*7/6,Math.PI*11/6,false);
c.fill();
c.closePath();
c.stroke();
6，绘制环形：
c.fillStyle="yellow";
c.strokeStyle="#a9a9a9";
c.lineWidth=2;
c.beginPath();
c.moveTo(300,300);
c.arc(300,300,200,Math.PI*7/6,Math.PI*11/6,false);
c.fill();
c.closePath();
c.stroke();
c.beginPath();
c.fillStyle="#a9a9a9";
c.moveTo(300,300);
c.arc(300,300,100,Math.PI*7/6,Math.PI*11/6,false);
c.fill();
c.closePath();
c.stroke();
7，文字的绘制方法：
strokeText("文字",x,y,maxWith) //绘制描边空心文字
fillText("文字",x,y,maxWith) //绘制实心
字体样式：font()
