javascript - PDF.js Inserting Images

Question

I've started using PDF.js, an excelent work, by the way.

But now I want to insert an image (from a canvas element) on the pdf page. Here's my code:

var image = myCanvas.getContext('2d').getImageData(0,0,400,300),
doc = new pdf();
doc.setProperties({
    title: fileName,
    author: 'VirtuaLab?',
    creator: 'pdf.js'
});
doc.addPage();
data = doc.output();

But I haven't found anything about inserting images on PDF.js pages.

Maybe doc.image() or doc.addImage?

Answer 1

Disclaimer: I work for Bytescout

Unfortunately PDF.js not working with images and that is why we developed PDF Generator SDK for Javascript (free for non-commercial use) where you can add image (from url or canvas) like this:

// load image from local file
pdf.imageLoadFromUrl('image1.jpg');
// place this mage at given X, Y coordinates on the page
pdf.imagePlace(20, 40);

Important to say that you can face limitation on image size as BytescoutPDF.js may consumes memory to process large image (this issue is caused by the memory limitations for javascript).

However the script should work fine in case you just need to insert logo image or small picture into generated pdf.

UPDATE: the latest version of jsPDF (not to be confused with PDF.js) seems to work with images, see the sample on examples page.