canvas绘制路径

我们单独使用canvas绘制图形时我们只可以绘制矩形，但是我们还会有其他的图像，我们绘制其他的图像我们就要通过绘制路径的方法图绘制其他的图形

**

绘制路径的步骤：

**
1、移动画笔到起始位置：
ctx . moveTo(x,y);
2、绘制一条当前位置到下一个位置的线line（线）：（需要几条就画几条）
ctx.lineTo(x,y);
3、确定图像是填充的还是空心实线：

**

填充：

**
ctx.fill(); //里面没有参数 会自动合璧路径
**

轮廓：

**
ctx.stroke();

closePash（）；自动合璧路径

//如：画一个三角形：
ctx.moveTo(50,50);//初始位置（50，50）
ctx.lineTo(50,100);   //画一条从初始位置到（50，100）的线
ctx.closePash();   //自动合璧最后一条线   如果没有这个方法，我们还要画一条线，从（50，100）到（50，50）的线
ctx.fill() ;  //或  ctx.stroke();

**

beginPath()方法：

**
清空路径，我们在每画一个图形尽量第一步就是清空路径容器，如果不清空后一个图形会影响前一个图像
ctx.beginPath();

**

save()方法与restore（）：

**
这相当与一个简单的作用域以save开头，restore结尾
在我们绘制多个不相干的图形是：(画几个就写几个) save与restore必须同时出现
ctx.save();
//这里写图形样式
ctx.beginPath();
//绘制路径
ctx.restore();