1）首先canvas的原點在畫布的左上角上，有時候為了方便需要將原點平移，使用ctx.translate(x, y)函式；後面的座標定位都是以這個點為基準
2）矩形，影象的距離原點的座標以它們的左上角為起點
3）描邊和填充是兩個不同的概念，描邊使用strokeStyle屬性，呼叫stroke來實現；
填充使用fillStyle，呼叫fillRect()填充矩形，fillText()填充文字，fill()填充路徑；填充和描邊方法相當於渲染生成影象在螢幕上。
4）描繪路徑的時候必須先使用ctx.beginPath()；ctx.moveTo表示將繪圖點移動到此點，lineTo才是負責將上一點連線到下一點的路徑，closePath()不必要顯示關閉，呼叫fill(), stroke()都會自動閉合路徑。
5）由於fillStyle等屬性是全域性的，所以需要藉助棧結構來呼叫save()來儲存上一次的畫筆屬性；呼叫restore()返回上一層畫筆屬性。
6）清除畫布方法：clearRect(x,y,width,height)用來清除canvas畫圖上的以x，y為起點，width，height為寬高的矩陣區域。
7）操作影象資料：drawImage畫上去之後使用getImageData來獲取指定的位置的影象資料：
var imageData = ctx.getImageData().data // 裡面每四個元素儲存一個畫素點的 r g b a的值
注意：影象必須是同域，否則會報跨域錯誤
8）合成：globalAlpha指定全域性的透明度，globalCompositionOperation指定兩個圖形之間如何層疊。