Unable to add margin on addImage() function of jsPDF for multiple pages

I am trying to generate PDF of some html tables with jspdf. The addImage() function is working fine but when the size of image is more than the pdf page size the image continues on the next page as shown in the image above

i am trying to add a margin or padding on every page so that it gets rendered correctly. Any Help would be appreciated.This is an angular project. I have added my code below.

public captureScreen() {
var data = document.getElementById('content');
html2canvas(data).then(canvas => {
// Few necessary setting options

const contentDataURL = canvas.toDataURL('image/png')
var imgWidth = 210;
var pageHeight = 295;
var imgHeight = canvas.height * imgWidth / canvas.width;
var heightLeft = imgHeight;

var doc = new jsPDF('p', 'mm');
var position = 0;

doc.addImage(contentDataURL, 'PNG', 0, position, imgWidth, imgHeight);

heightLeft -= pageHeight;

while (heightLeft >= 0) {
position = heightLeft - imgHeight;
doc.addPage();
doc.addImage(contentDataURL, 'PNG', 0, position, imgWidth, imgHeight);
heightLeft -= pageHeight;
}
doc.save( 'file.pdf');

});


}

Continue reading...