jspdf doesn't return the entire html page to pdf

Question

enter image description hereI am trying to convert html page to PDF using JSPDF.The page is rendered in my screen with 65% resolution by default and upon converting this to PDF, it renders the PDF with a black strip on the right side of the generated PDF. Resolving screen size to 100%, the black strip increases in thickness.

JSPDF method is applied to the entire div<> containing the page content. Tried to fix the width of the content and page to adjust the content within the screen.

var pdf = new jsPDF('p', 'pt','a4');
    pdf.page = 1;
    var totalPages=1;

    pdf.text("Report", 220, 22);// set your margins

    var str = "Page " + pdf.page  + " of " +  totalPages;
    pdf.setFontSize(9);// optional
    pdf.text(str, 250, pdf.internal.pageSize.height - 10);
    pdf.text("Confidential", 490, pdf.internal.pageSize.height - 10);
    pdf.internal.scaleFactor = 2.10;
    pdf.addHTML($('#reportTabContent')[0], 30, 30, {
        'height': 1750,
        'width': 1058, 
        background: '#fff', 
        pageSplit:'true'
      },function () {       
          pdf.save('Reports.pdf');
      });

I expect the HTML page as it is in PDF form. But the jspdf is creating pdf of the html page with a black patch in the right side of the generated pdf. Please help.enter image description here

@barbsan let's tag it both, just to be safe... and annoy java users ;) — Amongalen

Thien Ly Thien Ly · Accepted Answer · 2019-05-30T05:58:05

Sometimes, the issue comes from the css code applied to that div, not the configuration with jsPdf. Can you also share you css code of that div?

jspdf doesn't return the entire html page to pdf

2 Answers