Auto width images in columns using pdfmake.js

Question

I'm trying to create a simple 2-up image layout, so each image is 50% page width in two columns, however the 'auto' or '*' widths don't seem to work with images.

Is there any way to achieve this without setting explicit widths for the images?

Or if not, is it possible to get the width of the page so I can do the math myself?

Edit:

A simplified version of the code I've tried is:

var dd = {
content: [
    {
        columns: [
            {
                image: 'sampleImage.jpg',
                width: 'auto'
            },
            {
                image: 'sampleImage.jpg',
                width: '*'
            }
        ]
    }
]
}

Using those auto widths I just get Uncaught Error: unsupported number: NaN in the console. If I change them to fixed widths, however, they work fine.

Answer 1

I'm not sure if this functionality is available in the library or not. People have raised this as an issue on the pdfmake github issue page, and the same are still open.

• Set image size in percentage of the page
• Image auto widths and columns

But you can still implement it yourself by taking page width.

var pageWidth = 900;
var pageHeigth = 1000;

var docDefinition = {
    pageSize: {
        width: pageWidth,
        height: pageHeigth
    },
    pageMargins: [10, 10, 10, 10],
    content: [{
        image: imageEncodedData,
        width: pageWidth / 2, // for 50 % image width
        height: pageHeigth / 2, // change the numbers accordingly
        absolutePosition: {  // absolute positioning if required
            x: 270,
            y: 45
        }
    }
};