HTML5 canvas——插入圖像

視頻內(nèi)容：

    在canvas中顯示圖片非常簡(jiǎn)單?？梢酝ㄟ^(guò)修正層為圖片添加印章，拉伸或者修改圖片，并且圖片通常會(huì)成為canvas上的焦點(diǎn)。用HTML5 canvas API內(nèi)置的幾個(gè)簡(jiǎn)單命令可以輕松地為canvas添加圖片內(nèi)容。

    不過(guò)，圖片增加了canvas操作的復(fù)雜度，因?yàn)楸仨毜鹊綀D片完全加載后才能對(duì)其進(jìn)行操作。瀏覽器通常會(huì)在頁(yè)面腳本執(zhí)行的同時(shí)異步加載圖片。如果視圖在圖片未完全加載后才能對(duì)其呈現(xiàn)到canvas上，那么canvas將不會(huì)顯示任何圖片。因此，開發(fā)人員要特別注意，在呈現(xiàn)之前，應(yīng)確保圖片已經(jīng)加載完畢。

    為保證在呈現(xiàn)之前圖片已完全加載，可以進(jìn)行回調(diào)，即只有當(dāng)圖像加載完成時(shí)才執(zhí)行后續(xù)代碼。

    視頻中有一個(gè)案例，如有需要，請(qǐng)看視頻。