PDF.js Inserting Images

26,459

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.

Share:
26,459
Danilo Valente
Author by

Danilo Valente

GitHub account: Danilo Valente NPM profile: danilo-valente

Updated on July 17, 2022

Comments

  • Danilo Valente
    Danilo Valente almost 2 years

    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?