canvas知识点总结

1、基本元素的使用

1、画边：stroke
2、填充：fill
3、画边样式：strokeStyle
4、填充样式：fillStyle

2、绘制基本图形

1、矩形：rect
2、填充矩形：fillRect
3、描边矩形：strokeRect
4、透明矩阵：clearRect
5、圆形：arc
6、圆形路径：arcTo

3、画线

1、起始点：moveTo
2、经过点：lineTo
3、线宽度：lineWith
4、线两端样式：lineCap
5、线拐弯样式：lineJoin

4、canvas栈操作

1、样式压栈：save
2、样式弹栈：restore
3、清除路径栈：beginPath

5、变换

1、原点坐标移动：translate
2、旋转坐标轴：rotate
3、原点为圆心进行缩放：scala

6、绘制文本

1、字体大小：font  （例如，ctx.font="60px aaa"，后面一定要随便加点东西，样式才能生效）
2、文字基线对齐方式：textBaseline
3、填充方式：fillText
4、测量文字对象：measureText

7、图片操作

1、绘制图片到canvas：drawImageData
2、获取canvas中的图片对象：getImageData
3、将imageData对象放入到canvas中：setImageData
4、创建imageData对象：createImageData

8、合成操作

新的路径：source
            source-over：新路径覆盖
            source-in：只有新旧路径重合的区域
            source-out：除去新路径和旧路劲重叠部分
            source-atop
旧的路径：destination：
			destination-over
            destination-in
            destination-out
            destination-atop

9、其他操作

1、导出图像：toDataURL
2、判断路径上是否有这个点：isPointInPath