我有一个脚本使用
HTML2Canvas在页面中截取div的截图,然后使用jsPDF将其转换为pdf.
问题是生成的pdf只有一页,在某些情况下屏幕截图需要多个页面.例如,屏幕截图大于8.5×11.宽度很好,但我需要它来创建多个页面以适应整个屏幕截图.
这是我的脚本：
var pdf = new jsPDF('portrait','pt','letter');
$('.export').click(function() {
pdf.addHTML($('.profile-expand')[0],function () {
pdf.save('bfc-schedule.pdf');
});
});
解决方法
pdf.addHtml doesnot work if there are svg images on the web page..
I copy the solution here: // suppose your picture is already in a canvas var imgData = canvas.toDataURL(‘image/png’); /* Here are the numbers (paper width and height) that I found to work. It still creates a little overlap part between the pages,but good enough for me. if you can find an official number from jsPDF,use them. */
var imgWidth = 210;
var pageHeight = 295;
var imgHeight = canvas.height * imgWidth / canvas.width;
var heightLeft = imgHeight;
var doc = new jsPDF('p','mm');
var position = 0;
doc.addImage(imgData,'PNG',position,imgWidth,imgHeight);
heightLeft -= pageHeight;
while (heightLeft >= 0) {
position = heightLeft - imgHeight;
doc.addPage();
doc.addImage(imgData,imgHeight);
heightLeft -= pageHeight;
}
doc.save( 'file.pdf');`
