如何將DIV另存爲圖片以canvas2image爲擴展名

我已經完成了以下代碼以將HTML內容（DIV）保存爲圖片（JPEG，PNG，GIF等）以下代碼。如何將DIV另存爲圖片以canvas2image爲擴展名

<pre> 
html2canvas($(".mainbox"), { 
    onrendered: function(canvas) { 
     theCanvas = canvas; 
     document.body.appendChild(canvas); 
     Canvas2Image.saveAsImage(canvas); 
     $("#FinalImage").append(canvas); 
    } 
}); 
</pre>

我也包括html2canvas.js，base64.js和canvas2image.js在我的網頁。最後，圖像顯示在#FinalImage DIV和瀏覽器問我保存在我的驅動器到現在一切正常。

現在問題是保存的圖像的名稱沒有擴展名，每次我需要去圖像和分配擴展名（「。JPG」，「。PNG」等...）。當用戶從瀏覽器保存時，是否有任何解決方案默認設置擴展名。

在此先感謝。

來源

2014-10-07 Jignesh Patel

我已經完成了用於捕獲簽名的相同功能。這與你的方法不同。但是這段代碼可能會幫助你。如果你需要整個源代碼，請點評。

var canvas = document.getElementById(<canvas element id>)// get canvas element 
var dataURL = canvas.toDataURL("image/png");// convert to img, specify extension 
document.getElementById(<new image id>).src = dataURL; // write as an image

在雙線我指定png。還有，你可以改變圖像的延伸。希望它有幫助

來源

2014-10-07 12:39:38 Khaleel

感謝您的幫助。仍然面臨同樣的問題。內容正常轉換爲圖像。它顯示在瀏覽器頁面中。「Canvas2image.js」使用「saveFile」功能，我認爲有一些問題。問題發生在Firefox中，在Chrome中它正常工作。 – 2014-10-08 06:24:13

在你的代碼中，你需要使用'saveAsPNG（canvas）'而不是使用'saveAsImage（canvas）'這樣的工作 – Khaleel 2014-10-10 10:47:57

如何將DIV另存爲圖片以canvas2image爲擴展名

回答

相關問題