jsPDF Tutorial to Change Default Page Width and Height and Font Size in Javascript Full Tutorial For Beginners

 

 

You can get the width and height of PDF document like below,

 

 

 

// Document of 210mm wide and 297mm high
new jsPDF('p', 'mm', [297, 210]);
// Document of 297mm wide and 210mm high
new jsPDF('l', 'mm', [297, 210]);
// Document of 5 inch width and 3 inch high
new jsPDF('l', 'in', [3, 5]);

 

 

For anyone trying to this in react. There is a slight difference.

 

 

// Document of 8.5 inch width and 11 inch high
new jsPDF('p', 'in', [612, 792]);

 

 

// Document of 8.5 inch width and 11 inch high
new jsPDF({
        orientation: 'p', 
        unit: 'in', 
        format: [612, 792]
});

 

 

}).then((canvas) => {
  const img = canvas.toDataURL('image/jpg');
  new jsPDF({
        orientation: 'l', // landscape
        unit: 'pt', // points, pixels won't work properly
        format: [canvas.width, canvas.height] // set needed dimensions for any element
  });
  pdf.addImage(img, 'JPEG', 0, 0, canvas.width, canvas.height);
  pdf.save('your-filename.pdf');
});

Leave a Reply