Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

112
Views
jsPDF insert html from specified id into a specific pdf page

I am creating a pdf using jsPDF in angular.

The HTML

<div id="myid">HTML GOES HERE</div>

create PDF js:

genPDF(){ 
    html2canvas(document.getElementById('myid'), {
       allowTaint: true,
       useCORS: false,
       scale: 1,
    }).then((canvas) => {

    var img = canvas.toDataURL("image/png");

    var imgWidth = 210; 
    var pageHeight = 297;  
    var imgHeight = canvas.height * imgWidth / canvas.width;
    var heightLeft = imgHeight;
    var position = 10;
    var doc = new jsPDF()

    doc.setFontSize(16);
    doc.addImage(img, 'PNG', 0, position, imgWidth, imgHeight);

    doc.setProperties({
      title: 'Test pdf'
    });

    heightLeft -= pageHeight;

    while (heightLeft >= 0) {
      position += heightLeft - imgHeight;

      doc.setFontSize(22);
      doc.text(20, 20, 'This is a title');

      doc.addPage();
      doc.addImage(img, 'PNG', 10, position, imgWidth, imgHeight);
      heightLeft -= pageHeight;
    }

    doc.save( 'mypdf.pdf');
 
   });
}

Is it possible to call different element to go into a particular page when required?

For example I want to create a cover page for page 1 and I'd like to have it in another element.

So is it possible to have something for page 1 like:

<div id="mycoverpageId">My Cover page html here</div>

How can I do this?

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!