我正在尝试使用html2canvas在JavaScript angular中创建一个'save div as png'函数。 它“几乎”有效,除了图像质量可能更好(主要是文本)
但是有时只会打开一个空白画布而不捕捉其中的元素。
我没有使用下载功能,而是尝试使用window.open(数据)而我只是打开一个带有空画布的新窗口。 我还确认,在收到'另存为png div'时收到了id。
$scope.savePNG = function(id) {
var target = document.getElementById(id);
html2canvas(target, {
onrendered: function(canvas) {
var data = canvas.toDataURL("image/png", 1);
// data is the Base64-encoded image
download(data, "Graph.png", "image/png");
// window.open(data);
}
});
};
function download(data, filename, filetype) {
// create an "off-screen" anchor tag
var lnk = document.createElement('a');
// the key here is to set the download attribute of the a tag
lnk.download = filename;
lnk.href = data;
// create a "fake" click-event to trigger the download
if (document.createEvent) {
var e = document.createEvent("MouseEvents");
e.initMouseEvent("click", true, true, window,
0, 0, 0, 0, 0, false, false, false,
false, 0, null);
lnk.dispatchEvent(e);
} else if (lnk.fireEvent) {
lnk.fireEvent("onclick");
}
}