jsPdf using html2canvas.js for export pdf from html is not working for large data

问题

Hi I am using jsPdf for making pdf of html content, it is going fine for short content and creating pdf , but when I am trying to use it on large content with html2canvas.js (for rendering css), it is not creating pdf. Any suggestions or sample code for this would be helpful.Thank you.

回答1:

It is possible to create pdf for large files. There are primarily two ways to do this :

1. html -> canvas -> image -> pdf (I assume you are trying this approach)

2. html -> pdf (does not work if html contains svg)

I would suggest you to go for (2) unless you have a good reason to go for (1) (like if you are have svg content)-- it is quite expensive operation for the browser and there is possibility of the browser crashing too.

1. html -> canvas -> image -> pdf

This is very neatly described here - https://github.com/MrRio/jsPDF/issues/339#issuecomment-53327389

My experience when using this method - crashes when the pdf generated contains more than 2-3 pages. (tested on latest chrome and firefox)

2. html -> pdf

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

pdf.addHTML($('body'), 0, 0, options, function(){
    pdf.save("test.pdf");
});

This is way faster compared to above approach. Generates pdf containing 5-6 pages in 1-2 seconds!

Hope this helps!

回答2:

PDFPY

https://www.npmjs.com/package/pdfpy

var data = {
    //the key as to be same as below
    input: "./test.html",
    output: "./output.pdf"
}

pdfpy.file(data, function(err, res) {
    if(err) throw err

    if(res) console.log("success")
});

来源：https://stackoverflow.com/questions/28250810/jspdf-using-html2canvas-js-for-export-pdf-from-html-is-not-working-for-large-dat

标签

javascript

html

css

html2canvas

jspdf