理解HTML5 canvas.translate(x,y)

规范原文如下:
The translate(x, y) method must add the translation transformation described by the arguments to the transformation matrix. The x argument represents the translation distance in the horizontal direction and the y argument represents the translation distance in the vertical direction. The arguments are in coordinate space units.
原文见:http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-translate

translate(x,y)函数是将整个canvas水平移动x距离，垂直移动y距离。
canvas是以（0,0）为默认原点，其原点默认在屏幕左上角；通过translate（x，y）把点（x，y）作为原点。
需要注意的是：是在原点的基础上分别偏移x和y。
例子：原点假如落在（1，1），那么translate（10，10）就是在原点（1，1）基础上分别在x轴、y轴移动10，则原点变为（11,11）。