1. 座標系
畫布左上角(0,0)默認原點x座標向右方增長，y座標則向下方延伸
(圖片來自mdn)
不過，Canvas的座標系統並不是一塵不變的，原點是可改變的。
座標變換：可以對Canvas座標系統進行移動translate、旋轉rotate和縮放等操作。
座標變換之後繪製的圖形x,y偏移量都以新原點爲準， 旋轉角度，縮放比，以新座標系角度爲準
例如同樣在原點位置寫上文字（x:0,y:0）, 在（0,50）位置繪製一個矩形，座標變換前後的效果如下：
這樣， 當我們繪製多個圖形時，既可以通過計算x，y偏移量控制圖形的顯示位置，也是通過變換座標來做
座標變換是屬於繪圖狀態存在Canvas繪圖的堆棧中的，可以通過save,restore重置或更新座標系
座標示例