一、状态保存&恢复
在对画布进行变形前，最好使用save将初始状态保存起来。把画布和坐标回到初始状态有利于之后的绘制。
ctx.save()将canvas的所有状态保存在栈中，包括ctx.restore()将最后保存的状态弹出
二、移动
ctx.translate(a, b)：将canvas画布和原点向x轴方向移动a距离，向y轴方向移动b距离。
这个方法很适合在使用前将初始状态保存起来，使用restore总比进行逆向移动要方便。
三、旋转
ctx.rotate(angle)：将canvas画布以原点为中心顺时针方向旋转angle度(弧度制)。
四、缩放
ctx.scale(a, b)：将canvas画布以原点为中心向x轴方向缩放a倍，y轴方向缩放b倍。a和b为负数的时候则是将画布以原点为中心向x轴方向、y轴方向翻转。
五、变形
这个方法是将当前的变形矩阵乘上一个基于自身参数的矩阵，如下面的矩阵所示：\left[ \begin{array}{ccc} a & c & e \ b & d & f \ 0 & 0 & 1 \end{array} \right]
如果任意一个参数是
Infinity，变形矩阵也必须被标记为无限大，否则会抛出异常。这个函数的参数各自代表如下：
a (m11)：水平方向的缩放b(m12)：竖直方向的倾斜偏移c(m21)：水平方向的倾斜偏移d(m22)：竖直方向的缩放e(dx)：水平方向的移动f(dy)：竖直方向的移动
setTransform(a, b, c, d, e, f)这个方法会将当前的变形矩阵重置为单位矩阵，然后用相同的参数调用
transform方法。如果任意一个参数是无限大，那么变形矩阵也必须被标记为无限大，否则会抛出异常。从根本上来说，该方法是取消了当前变形,然后设置为指定的变形,一步完成。重置当前变形为单位矩阵，它和调用
ctx.setTransform(1, 0, 0, 1, 0, 0)是一样的
六、组合globalCompositeOperation
默认状态下新绘制的图像会覆盖旧图像，由于canvas没有图层概念，所以提供了globalCompositeOperation = type这个属性来代替。共有以下值（在photoshop中测试了一下，破折号后面是PS cs6的叫法。顺便吐槽MDN里后面的基本都是机翻&yy…）：
source-over：默认设置，在现有画布之上覆盖新图形。source-in：将旧图形作为新图形的遮罩层。source-out：将旧图形透明度取反，作为新图形的遮罩层。source-atop：锁定旧图形不透明度。destination-over：旧图形会覆盖在新图形上。destination-in：将新图形作为旧图形的遮罩层。destination-out：将新图形透明度取反，作为旧图形的遮罩层。destination-atop：锁定新图形不透明度，将旧图形绘制在上面。lighter：两个重叠图形的颜色是通过颜色值相加来确定的。——浅色copy：删除旧图形，绘制新图形。xor：异或运算。图像中，那些重叠和正常绘制之外的其他地方是透明的。multiply：将顶层像素与底层相应像素相乘，结果是一幅更黑暗的图片。——正片叠底screen：像素被倒转，相乘，再倒转，结果是一幅更明亮的图片。——滤色overlay：multiply和screen的结合，原本暗的地方更暗，原本亮的地方更亮。——叠加darken：保留两个图层中最暗的像素。——变暗lighten：保留两个图层中最亮的像素。——变亮color-dodge：将底层除以顶层的反置。——颜色减淡color-burn：将反置的底层除以顶层，然后将结果反过来。——颜色加深hard-light：屏幕相乘，类似于叠加，但上下图层互换了。——强光soft-light：用顶层减去底层或者相反来得到一个正值。——柔光difference：根据上下两边颜色的亮度分布，对上下像素的颜色值进行相减处理。——差异模式，差值exclusion：和difference相似，但对比度较低。——排除hue：决定生成颜色的参数包括：底层颜色的明度与饱和度，上层颜色的色调。——色调模式，色相saturation：决定生成颜色的参数包括：底层颜色的明度与色调，上层颜色的饱和度。按这种模式与饱和度为0的颜色混合（灰色）不产生任何变化。——饱和度color：决定生成颜色的参数包括：底层颜色的明度，上层颜色的色调与饱和度。这种模式能保留原有图像的灰度细节。这种模式能用来对黑白或者是不饱和的图像上色。——颜色luminosity：决定生成颜色的参数包括：底层颜色的色调与饱和度，上层颜色的明度。该模式产生的效果与Color模式刚好相反，它根据上层颜色的明度分布来与下层颜色混合。——明度
七、裁切路径
裁切路径和普通的 canvas 图形差不多，不同的是它的作用是遮罩，用来隐藏不需要的部分。它可以实现与 source-in 和 source-atop差不多的效果。最重要的区别是裁切路径不会在 canvas 上绘制东西，而且它永远不受新图形的影响。这些特性使得它在特定区域里绘制图形时相当好用。
clip()：将当前正在构建的路径转换为裁剪路径。
使用 clip()方法可以创建一个新的裁切路径。默认情况下，canvas 有一个与它自身一样大的裁切路径（也就是没有裁切效果）。