canvas入门

标签插入
<canvas id="canvas"></canvas>

获取标签
var canvas = document.getElementById('canvas');
获取context，全文使用context绘制
var context = canvas.getContext('2d')

绘制线段
context.moveTo(0,0);context.lineTo(100,100);

常用属性、
moveTo(0,0) 起点坐标
lineTo(100,100) 下一个点坐标,可多次使用，可与起点连接，构成各种形状的图形
lineWidth = 5 线段宽度
strokeStyle = '#005588' 线段背景
context.stroke() 绘制
fillStyle = 'rgb(2,100,30)' 图形填充背景
context.fill() 背景填充

context.beginPath() 开始一段路径
context.closePath() 结束一段路径，让绘制状态之间互不影响,如果区域未闭合，使用线段闭合

绘制弧形
context.arc(centerx,centery,radius,startingAngle,endingAngle,anticlockwise = false)
startingAngle,endingAngle 值为0，0.5，1，1.5
anticlockwise 绘制方向为逆时针/顺时针

对于闭合图形的重绘API
context.clearRect(参数)```