.....

1. 画布使用的基本步骤：
       1） 获取画布对象： document.querySelector(".mycanvas");
       2） 获取上下文对象： canvas对象.getContext('2d');
       3） 通过上下文对象确定起点： ctx对象.moveTo(x,y坐标)
       4） 第二个点： ctx对象.lineTo(x坐标，y坐标)
       5） 描边： ctx对象.stroke();
       6） 填充： ctx.fill（）
    
     2. 和线相关的属性和方法：
         1）描边的颜色： strokeStyle
         2）描边的宽度： lineWidth
         3）线的末端： lineCap  butt  round square
         4）线的拐角：lineJoin  miter  round  square
         5）设置虚线：setDashLine([5,10,20])
         6）获取虚线的集合，获取到的是一段不重复的线： getDashLine()
         7）虚线的偏移：lineDashOffset----向右为负，向左为正
    
     3. 填充颜色： fillStyle
     4. 绘制矩形：
           1） rect(x,y,w,h)----需要stroke()  fill()
           2） strokeRect(x,y,w,h)----描边矩形
           3） fillRect()----填充的矩形
           4） 橡皮擦： clearRect()
    
     5. 非0环绕： 方向是外还是内，在给闭合路径上色
           1) 在路径中添加一个射线
           2） 确定这条射线与路径相交点，如果路径逆时针，设置相交点为-1，顺时针，设置相交点为1，结果将所有相交点的值相加，如果值等于0，不上色，不等于0，添加填充颜色
    
      6. 开启新路径： ctx.beginPath();
         闭合路径：ctx.closePash()