I'm trying to add multiple different images to PDF with jsPDF framework but in the end it generates PDF file with two similar images however if I try to generate two different PDF files with each single image everything works fine. Here is my html:

<img id="img1" src="/img1.jpg">
<img id="img2" src="/img2.jpg">

Here is my JS:

var doc = new jsPDF("landscape");
const img1 = $('#img1').attr("src");
const img2 = $('#img2').attr("src");
doc.addImage(img1, "JPEG", 140, 15, 90, 90, 'SLOW');
doc.addImage(img2, "JPEG", 140, 110, 90, 90, 'SLOW');
doc.save("sample.pdf");

What am I doing wrong?

I'm trying to add multiple different images to PDF with jsPDF framework but in the end it generates PDF file with two similar images however if I try to generate two different PDF files with each single image everything works fine. Here is my html:

<img id="img1" src="/img1.jpg">
<img id="img2" src="/img2.jpg">

Here is my JS:

var doc = new jsPDF("landscape");
const img1 = $('#img1').attr("src");
const img2 = $('#img2').attr("src");
doc.addImage(img1, "JPEG", 140, 15, 90, 90, 'SLOW');
doc.addImage(img2, "JPEG", 140, 110, 90, 90, 'SLOW');
doc.save("sample.pdf");

What am I doing wrong?

• javascript
• html
• pdf
• pdf-generation
• jspdf

1 Answer 1

I should have had to give more attention to the documentation, there are alises in case you have to add multiple images, so the finale code should look like that:

var doc = new jsPDF("landscape");
const img1 = $('#img1').attr("src");
const img2 = $('#img2').attr("src");
doc.addImage(img1, "JPEG", 140, 15, 90, 90, "alias1", 'SLOW');
doc.addImage(img2, "JPEG", 140, 110, 90, 90, "alias2", 'SLOW');
doc.save("sample.pdf");