Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JSPDF - addHTML() Multiple Canvas Page

I noticed already have a release "addHTML() can now split the canvas into multiple pages" which can find through this link : https://github.com/MrRio/jsPDF/releases/tag/v1.0.138.

May i know how it work? In my case, i just tried it out when click on "save as pdf" button, it just render a single page instead of multiple pages (sometimes didn't worked, i assume because the content is too long to be generated as pdf).

Would appreciate if there are some examples for this case. Thanks!

Attached my codes below:

var pdf = new jsPDF('p', 'pt', 'a4');

pdf.addHTML($(".pdf-wrapper"), function () {
    var string = pdf.output('datauristring');
    pdf.save("test.pdf");
});
like image 982
Dion Alexander Avatar asked Sep 18 '14 04:09

Dion Alexander


People also ask

How do I create a multipage PDF in HTML?

Step 1) Include jsPDF and html2canvas liberary URl in head section of your HTML. In this code block we have used html2canvas function which will give canvas of HTML section we specified, then after getting canvas object we will add PDF page using a jsPDF method and add break-up of canvas s image(JPG) in PDF page.

What is addHTML?

addHTML will try to adjust the html element/document to fit the whole width of the PDF page size, which could imply stretching.


1 Answers

Splitting canvas into multiple pages work by providing a "pagesplit" option:

var pdf = new jsPDF('p', 'pt', 'a4');
var options = {
         pagesplit: true
    };

pdf.addHTML($(".pdf-wrapper"), options, function()
{
    pdf.save("test.pdf");
});
like image 51
diegocr Avatar answered Sep 21 '22 12:09

diegocr