canvas学习之给绘制出来的图形上色

复习

截止目前，canvas的各种绘制方法我们都已经学习过了，可以绘制出线条，三角形，长方形，圆，圆弧，圆滑的曲线等，在此基础上，拥有足够的创造力，我们可以使用js在canvas画板上画出各种形象来。下面我们对已经学习过的内容进行总复习，然后开启新的篇章，去认识丰富多彩的canvas世界。

• canvas是一个h5新添加的dom，在使用时要做好回退策略；
• canvas有一个getContext(‘2d’)接口来获取绘画上下文，所有的canvas绘制方法都基于此。
• 在开始绘制前，需要调用beginPath()来表示要开始绘画了。
• 一笔绘制结束后，如果不希望和下一笔相连，需要调用endPath()方法来结束，同时endPath()方法还有闭合首位两点的功能。
• 绘制结束后，只有调用stroke()或者fill()方法，图形才能显示出来，其中stroke()方法是使得线条有颜色，fill()方法将线条包裹的区域填充起来。
• 开始绘画后使用moveTo(x,y)方法来落笔，做为绘画开始的起点。
• 使用lineTo(x,y)方法将笔触移动到下一个点，与前一个点之间绘制出一条直线,前一个点可以时moveTo(x,y)的点，也可以时lineTo(x,y)的点。
• 利用lineTo(x,y)方法，我们可以绘制出各种图形来，只要我们有足够的想象力和相应的数学方法，最简单的就是三角形，四边形等一些常见的图形了。
• 为了减少操作，canvas为了们提供了两个绘制圆和圆弧的方法。第一个是arc(x,y,radius, startAngle,endAngle, antic