-
准备画笔：context对象(画笔)，也称为绘制环境，使用该对象在画布中绘制图形
getContext('2d') -
绘图：
(1)绘制线条：
初始位置、连线端点(终点)、描边(画线)
2d平面坐标系：画布的左上角是坐标原点(0,0),从原点开始向右延伸是x轴增大,向下延伸是y轴增大
(2)画线过程：
-
确定初始位置(起始点)：
moveTo(x,y) -
确定连接端点(终点)：
lineTo(x,y) -
描边：
stroke()
(3)线条的样式：
-
线宽：
lineWidth ='数值',默认以像素为单位 -
描边的颜色(线条颜色):
strokeStyle = '颜色名或16进制颜色值' -
端点的形状：
lineCap = '形状'
butt ： 默认值，无端点形状，显示的是直线的方形边缘
round：圆形端点
square：方形端点
(4)线的路径：在同一个画布中添加再多的连线端点路径只有一条
-
开始新的路径：
beginPath() -
闭合路径：
closePath() -
路径填充：
fill()
例子：
二、 圆的绘制
========================================================================
arc(x,y,r,开始角,结束角,方向)
| 参数 | 内容 |
| — | — |
| x,y | 圆心的坐标 |
| r | 圆的半径 |
| 开始角 | 开始的圆周率角度 |
| 结束角 | 结束的圆周率角度 |
| 方向 | 绘图方向(顺时针、逆时针)，true表示逆时针，false表示顺时针(默认) |
示例：
var canvas = document.getElementById(‘cavs’);
var context = canvas.getContext(‘2d’);
context.arc(150,80,50,0,2.0*Math.PI,false)
context.stroke()
三、 绘制火柴人
=========================================================================
代码：
