使用 jspdf 和 html2canvas 的动态 html 的多个 pdf 页面

Question

I got this template and Im trying to make it a pdf using jspdf and html2canvas:

<div id="tre" class="letter-content">
    <h5><b>My tittle</b></h5>
    <br>
    <p>My text here
    </p>
    <ul>
        {% for function in functions %}
            <li>
                <p>{{ function.description }}</p>
            </li>
        {% endfor %}
    </ul>

</div>

The pdf creation script is this one:

    function getPDF(){
        var HTML_Width = 1024;
        var HTML_Height = 768;
        var PDF_Width = 1024
        var PDF_Height = 768
        var canvas_image_width = 1050;
        var canvas_image_height = 950;

        html2canvas(document.getElementById("tre"),{ allowTaint:true}).then(function(canvas) {

            var imgData = canvas.toDataURL("image/jpg", 1);
            var pdf = new jsPDF('p', 'px', [PDF_Height, PDF_Width]);
            pdf.addImage(imgData, 'JPEG', 20, 0, canvas_image_width,canvas_image_height);
            pdf.save("Certificate.pdf");
        });
    }

But as you can see on the template, that "for" statement may create html for one record or for many, getting that when it renders many iterations, the jspdf only gets me only one page always, cutting the rest, how can I make it to create as many pages as it needs ??

Thanks in advance !!

Answer 1

Multiple pages pdf can be generated using jspdf. Please refer this link https://stackoverflow.com/a/59320184/9530728 .