将页面以图片的形式下载下来

文件URL：
https://cdn.bootcss.com/html2canvas/0.5.0-beta4/html2canvas.js
https://cdn.bootcss.com/jspdf/1.3.4/jspdf.debug.js
JS:
function to_image(name) {
event.preventDefault();
var targetDom = $("#report_grid");
var copyDom = targetDom.clone();
copyDom.width(targetDom.width()*1.5 + “px”);
copyDom.height(targetDom.height()*1.5 + “px”);
$(‘body’).append(copyDom);
svg2canvas(copyDom);
html2canvas(copyDom, {
allowTaint: true,
taintTest: false,
onrendered: function(canvas) {
var imgData = canvas.toDataURL(“image/png”);
var filename = name+’.png’;
// download
saveFile(imgData,filename);
copyDom.remove();
}
});
};
//
var saveFile = function(data, filename){
var save_link = document.createElementNS(‘http://www.w3.org/1999/xhtml’, ‘a’);
save_link.href = data;
save_link.download = filename;
var event = document.createEvent(‘MouseEvents’);
event.initMouseEvent(‘click’, true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
save_link.dispatchEvent(event);
};
//
function svg2canvas(targetElem) {
var svgElem = targetElem.find(‘svg’);
svgElem.each(function (index, node) {
var parentNode = node.parentNode;
var tempNode = document.createElement(‘div’);
tempNode.appendChild(node);
var svg = tempNode.innerHTML;
var canvas = document.createElement(‘canvas’);
//转换
canvg(canvas, svg);
parentNode.appendChild(canvas);
});
}
注：我当时是弹出框图片下载，页面应该也同样适用，页面布局不好可能会产生下载时内容缺失