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.

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.

• javascript
• pdfmake

• post your code, what did you try? – Nikhil Radadiya Commented Aug 23, 2017 at 13:30
• Updated question @NikhilRadadiya – evu Commented Aug 23, 2017 at 13:46
• I think you have to use fixed width, as you can see in playground example pdfmake/playground.html – Nikhil Radadiya Commented Aug 23, 2017 at 13:50
• Yeah that's the point, I either need percentage based/auto widths, or I need a way to know how big the page is (in pixels) that I'm printing out so I can work out a fixed width myself. – evu Commented Aug 23, 2017 at 14:48

1 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
        }
    }
};