HTML5 繪制圖像 插入圖像

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

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

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