我有一个脚本使用
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');`
