如何将DIV另存为带有canvas2image扩展名的图像

Question

我已完成以下代码，使用以下代码将HTML Content（DIV）转换为图像（JPEG，PNG，GIF等）。

<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。最后，图像显示在#FinalImageDIV中，浏览器要求我将其保存到驱动器中，直到现在一切正常。

现在的问题是保存的图像名称没有扩展名，每次我需要转到图像并分配扩展名时（“ .jpg”，“。png”等...）。当用户从浏览器保存时，是否有任何解决方案来默认设置扩展名。

提前致谢。

Answer 1

我已经完成了相同的功能来捕获签名。这与您的方法不同。但这段代码片段可能对你有帮助。如果您需要完整的源代码，请发表评论。

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。您可以更改图像的扩展名。希望能帮助到你