Skip to content

[BUG] addImage function is not working as expected in version 4.4.0 #2580

Open
@premjo

Description

@premjo

🐛 Bug Report

Generating the excel with image is broken in version 4.4.0, I have scenario where we need to add image into each row of the column. I have used the function addImage.

Lib version: 4.4.0

Steps To Reproduce

The below code generate the excel sheet, which would have headers (Column 1, Column 2, Column 3) along with data row with respective header. But the generated excel is broken, the images miss aligned in order and size.

image

const ExcelJs = require('exceljs');
const path = require('path');
const items = [
    { col1: "abc", col2: new Date(), col3: "dummyImage.jpg" },
    { col1: "dummy1", col2: new Date(), col3: "dummyImage.jpg" },
    { col1: "dummy2", col2: new Date(), col3: "dummyImage.jpg" }
]
const generateExcel = async () => {
    const workbook = new ExcelJs.Workbook();
    let ws = workbook.addWorksheet('my first worksheet');
    ws.columns = [
        { header: 'column 1', key: 'col1' },
        { header: 'column 2', key: 'col2' },
        { header: 'column 3', key: 'col3' }
    ];
    ws.getRow(1).eachCell((cell) => {
        cell.fill = {
            type: 'pattern',
            pattern: 'solid',
            fgColor: { argb: '0082f0' }
        };
        cell.font = { bold: true, color: { argb: 'fafafa' } }
    })
    // add a filter to the header row
    ws.autoFilter = 'A1:C1';
    // freeze the header row
    ws.views = [
        { state: 'frozen', xSplit: 0, ySplit: 1, topLeftCell: 'A2', activeCell: 'A2' }
    ];
    let rowPos = 2;
    for (let item of items) {
        ws.addRow({
            col1: item.col1,
            col2: item.col2
        })
        if (item.col3) {
            const imageId = workbook.addImage({
                filename: path.join('images', item.col3),
                extension: 'jpeg',
            });
            let cellName = `C${rowPos}:C${rowPos}`;
            ws.addImage(imageId, cellName);
        }
        let lastRow = ws.lastRow;
        lastRow.height = 115;
        rowPos++;
    }
    const filename = `todo.xlsx`;
    await workbook.xlsx.writeFile(filename);
    return filename;
}
generateExcel();

The expected behaviour:

image
This is output of the exceljs version 4.3.0 with same above code

The excel which get generated should have sheet with three columns and each row data get align with respective order along with image.

Possible solution (optional, but very helpful):

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions