JavaScript怎么把Canvas內(nèi)容轉(zhuǎn)成圖片？這篇文章運(yùn)用了實(shí)例代碼展示，代碼非常詳細(xì)，感興趣的小伙伴們可以參考借鑒，希望對(duì)大家能有所幫助。

創(chuàng)新互聯(lián)提供成都網(wǎng)站建設(shè)、成都網(wǎng)站制作、網(wǎng)頁設(shè)計(jì)，成都品牌網(wǎng)站建設(shè)，廣告投放等致力于企業(yè)網(wǎng)站建設(shè)與公司網(wǎng)站制作，十年的網(wǎng)站開發(fā)和建站經(jīng)驗(yàn),助力企業(yè)信息化建設(shè)，成功案例突破成百上千家,是您實(shí)現(xiàn)網(wǎng)站建設(shè)的好選擇.

使用JavaScript將圖片拷貝進(jìn)畫布

要想將圖片放入畫布里，我們使用canvas元素的drawImage方法：

// Converts image to canvas; returns new canvas element
function convertImageToCanvas(image) {
	var canvas = document.createElement("canvas");
	canvas.width = image.width;
	canvas.height = image.height;
	canvas.getContext("2d").drawImage(image, 0, 0);

	return canvas;
}

這里的0, 0參數(shù)畫布上的坐標(biāo)點(diǎn)，圖片將會(huì)拷貝到這個(gè)地方。

用JavaScript將畫布保持成圖片格式

如果你的畫布上的作品已經(jīng)完成，你可以用下面簡(jiǎn)單的方法將canvas數(shù)據(jù)轉(zhuǎn)換成圖片格式：

// Converts canvas to an image
function convertCanvasToImage(canvas) {
	var image = new Image();
	image.src = canvas.toDataURL("image/png");
	return image;
}

這段代碼就能神奇的將canvas轉(zhuǎn)變成PNG格式！

到此為止, 關(guān)于JavaScript把Canvas內(nèi)容轉(zhuǎn)成圖片的方法有了一個(gè)基礎(chǔ)的認(rèn)識(shí), 但是對(duì)于具體的使用方法還是需要多加鞏固和練習(xí)，如果想了解更多相關(guān)內(nèi)容，請(qǐng)關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊。