Как получить несколько страниц в формате pdf с помощью jsPDF с HTML2Canvas

У меня есть сценарий, который использует HTML2Canvas, чтобы сделать снимок экрана из div на странице и затем преобразовать его в pdf с помощью jsPDF.Как получить несколько страниц в формате pdf с помощью jsPDF с HTML2Canvas

Проблема заключается в том, что созданная pdf - это только одна страница, а в некоторых случаях на скриншоте требуется более одной страницы. Например, скриншот больше 8.5x11. Ширина прекрасна, но мне нужно создать более одной страницы, чтобы она соответствовала всем снимкам экрана.

Вот мой сценарий:

var pdf = new jsPDF('portrait', 'pt', 'letter'); 
$('.export').click(function() { 
     pdf.addHTML($('.profile-expand')[0], function() { 
      pdf.save('bfc-schedule.pdf'); 
     }); 
});

Любые идеи, как я мог бы изменить, что позволит несколько страниц?

источник

2014-11-20 Tom Nolan

аналогичный учебник по этому http://freakyjolly.com/create-multipage-html-pdf-jspdf-html2canvas/ –

вы можете использовать страницу раздвоение вариант addhtml так:

var options = { 
    background: '#fff', 
    pagesplit: true 
}; 

var doc = new jsPDF(orientation, 'mm', pagelayout); 
doc.addHTML(source, 0, 0, options, function() { 
     doc.save(filename + ".pdf"); 
     HideLoader();`enter code here` 
});

Примечание: Это будет разорвать HTML на нескольких страницах, но эти страницы будут растянуться. Растяжка - это проблема в addhtml до сих пор, и я до сих пор не могу найти в Интернете, как решить эту проблему.

источник

2015-09-23 09:56:06

Существует [вопрос] (https://github.com/ MrRio/jsPDF/issues/339) на github jsPDF, где обсуждаются проблемы растяжения и размытые проблемы. Они предоставляют некоторые обходные пути. – L84

Он растягивает HTML? – Dynamic

С последним jsPDF он отлично работает для меня с параметром pageplit = true. –

pdf.addHtml оленья кожа работа, если есть SVG изображений на веб-странице .. скопировать решение здесь: // предположим, что ваша картина уже в брезентовой вар imgData = canvas.toDataURL ('изображение/PNG ');/* Вот цифры (ширина и высота бумаги), которые я нашел для работы. Он по-прежнему создает небольшую часть перекрытия между страницами, но для меня это достаточно хорошо. если вы можете найти официальный номер из jsPDF, используйте их. */

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', 0, position, imgWidth, imgHeight); 
heightLeft -= pageHeight; 

while (heightLeft >= 0) { 
    position = heightLeft - imgHeight; 
    doc.addPage(); 
    doc.addImage(imgData, 'PNG', 0, position, imgWidth, imgHeight); 
    heightLeft -= pageHeight; 
} 
doc.save('file.pdf');`

источник

2016-08-05 12:09:12

Как получить несколько страниц в формате pdf с помощью jsPDF с HTML2Canvas

ответ

Смежные вопросы