我找到了这个https://jsfiddle.net/8ypxW/3/我想知道如何将图像下载到桌面。我只看到保存png,但没有下载,如果可能的话,你能给我脚本吗?
$(function() {
$("#btnSave").click(function() {
html2canvas($("#widget"), {
onrendered: function(canvas) {
theCanvas = canvas;
document.body.appendChild(canvas);
// Convert and download as image
Canvas2Image.saveAsPNG(canvas);
$("#img-out").append(canvas);
// Clean up
//document.body.removeChild(canvas);
}
});
});
});
最佳答案
问题是你的 fiddle 中canvas2image.js脚本的URL错误。我用合适的 fiddle 制作了一个 fiddle 供您查看。在下面的代码中您可以看到 2 个“保存 PNG”按钮。一种是使用 Canvas2Image.saveAsPNG 函数,但此方法的小问题是您无法给出保存图像的名称。第二个按钮使用 HTML download attribute ,但并非所有浏览器都支持。
$(function() {
$("#btnSave").click(function() {
html2canvas($("#widget"), {
onrendered: function(canvas) {
Canvas2Image.saveAsPNG(canvas);
}
});
});
$("#btnSave2").click(function() {
html2canvas($("#widget"), {
onrendered: function(canvas) {
saveAs(canvas.toDataURL(), 'canvas.png');
}
});
});
function saveAs(uri, filename) {
var link = document.createElement('a');
if (typeof link.download === 'string') {
link.href = uri;
link.download = filename;
//Firefox requires the link to be in the body
document.body.appendChild(link);
//simulate click
link.click();
//remove the link when done
document.body.removeChild(link);
} else {
window.open(uri);
}
}
});
关于javascript - 下载 html2canvas 图像到桌面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41165865/