Canvas进阶
阴影
渐变
线性渐变
径向渐变
- createRadiaGradient(x1, y1, r1, x2, y2, r2)
- addColorStop()
把背景图片作为填充
- createPattern(imgDom, repeate)
- 第二个参数 repeate/ repeat-x / repeat-y / no-repeat
变换
缩放
- sacle(x, y)
位移
- translate(x, y)
旋转
- rotate(angle)
环境的保存和恢复
- save()
- restore()
设置透明
- globalAlpha = number 设置不透明度
- 全局设置是对整个画布（绘图环境） 进行设置
限定绘图区域
- clip()
输出base64编码
- canvas.toDataURL(type, encoder)
- type为mime类型 image/jpeg image/gif image/png image/webp
画布渲染画布
把一个画布以图片的形式用 drawImage() 插入到另一个画布
这是一种canvas的优化手段
设置线条
-
lineCap 属性 设置线条两端的形状
- butt:默认，向线条的每个末端添加平直的边缘。
- oround 、、
- square： 向线条的每个末端添加正方形线帽。
-
lineJoin 属性 设置线条夹角
- miter: 默认.创建尖角
- bevel:创建斜角.
- round: 创建圆角.
miterLimit 属性 设置夹角斜角的最大长度 一般默认 10
