###在canvas中插入圖片(需要image對象)
1.canvas操作圖片時，必須要等圖片加載完才能操作
2.drawImage(image, x, y, width, height)
其中 image 是 image 或者 canvas 對象，x 和 y 是其在目標 canvas 里的起始坐標。
這個方法多了2個參數：width 和 height，這兩個參數用來控制 當像canvas畫入時應該縮放的大小
###在canvas中設置背景(需要image對象)
1.createPattern(image, repetition)
image:圖像源
epetition:
"repeat"
"repeat-x"
"repeat-y"
"no-repeat"
一般情況下，我們都會將createPattern返回的對象作為fillstyle的值
###漸變
canvas漸變（線性漸變）
createLinearGradient(x1, y1, x2, y2)
表示漸變的起點 (x1,y1) 與終點 (x2,y2)
gradient.addColorStop(position, color)
gradient :createLinearGradient的返回值
addColorStop 方法接受 2 個參數，
position 參數必須是一個 0.0 與 1.0 之間的數值，表示漸變中顏色所在的相對位置。
例如，0.5 表示顏色會出現在正中間。
color 參數必須是一個有效的 CSS 顏色值（如 #FFF， rgba(0,0,0,1)，等等）
canvas漸變（徑向漸變）
createRadialGradient(x1, y1, r1, x2, y2, r2)
前三個參數則定義另一個以(x1,y1) 為原點，半徑為 r1 的圓，
后三個參數則定義另一個以 (x2,y2) 為原點，半徑為 r2 的圓。