Canvas画布 位图

1. 不要在style中给canvas设置宽高 会有位移差

 

fillRect()  绘制一个填充的方块  默认颜色是黑色

strokeRect() 绘制带边框的方块

绘制线条

moveTo() 绘制线段的起点

lineTo() 绘制线段的领点

每个线条只能有一个moveTo可以有多个lineTo

Stroke()绘制线段

beginPath()

ClosePath()  二者同时出现  将绘制路径闭合

（起始点 结尾点首尾相连）

Rect() 绘制方块

clearRect(0,0,width,height)清除画布

Can.save()

Can.restore()   二者成对出现 中间的属性样式只影响内部 不影响外部

画圆

 

200，200 是圆心坐标

50 是半径

0是起始弧度  Math.PI是结束弧度

True 是逆时针方向

注意 角度有正负之分  顺时针转的角度是正的 逆时针转的角度是负的

 

 

贝塞尔曲线 了解

 

画布的平移和旋转

平移translate 画布大小位置不变  起始坐标 变了

 

 

相当于坐标平移

Rotate()

画布的旋转都是以00起始点为中心点旋转

Scale(0.5,0.5)

画布的缩放  就是将画布向后移动 跟人的视距就变远了 近大远小

画布中插入图片

 

插入字体

 

200,200字体的起始点 默认在起始点在字体的左下角