canvas

1、canvas API（画布）是在HTML5中新增的标签用于在页面实时生成图像，并且可以操作图像内容，基本上他是一个可以用javascript操作的位图
2、canvasElement.getContext('2d');
获取画布
canvas默认宽为300高为150
不能在样式里设置宽高，只能通过属性
canvas圆点在左上角 0 0
canvas不能在样式里设置高，只能通过width和height

3、设置线段起点
ctx.moveTo(x,y)
设置线段终点
ctx.lineTo(x,y)
描边
ctx.stroke() strokeStyle
设置描边宽度
lineWidth
填充
ctx.fill() fillStyle 默认黑色

4、开始路径和结束路径
ctx.beginPath（）
ctx.closePath（）

5、绘制矩形
ctx.rect（x，y，width，height）透明 width 负数时向左，正数向右 height 负数时向上，正数时向上
ctx.strokeRect(z,y,width,height) 描边矩形 rect（）+stroke()
ctx.fillRect(z,y,width,height) 填充矩形 rect（）+fill()

6、移动画布原点
ctx.translate(x,y)
绘制文字
ctx.fillText(文本内容,x,y) 填充文字
ctx.strokeText(文本内容,x,y) 描边文字
ctx.font=“a，b” a是指字体大小 b是指是否加粗字体
ctx.textAlign='left(start)|center|right|end'; 水平对齐方式
ctx.textBaseline='bottom|top|middle'; 垂直对齐方式

7、arc(x,y,半径,start,end,方向)
x，y圆心点坐标
start起始弧度
end 终止弧度
方向 false顺时针 true 逆时针

8、合并参数
$.extend()
为什么第一个参数是空的？
为了防止默认参数呗修改
Object.assign
function extend(){
var obj=arguments[0];
for(var i=1;i<arguments.length;i++){
for(var key in argumtns[i]){
obj[key]=arguments[i][key]
}
};
return obj;
}

9、角度转弧度Math.PI/180
10、save（） 保存当前环境的状态
11、restore（）返回之前保存过的路径状态和属性
12、