EXCELJS - adding an image above the column headers in exceljs

Question

I am using exceljs library in react application. I am inserting my company logo on top of my data (and their headers), but my code just inserts it on top of everything.

const imageId2 = workbook.addImage({
        base64: myBase64Image,
        extension: 'png',
      });
      worksheet.addImage(imageId2, 'A1:D3');
      worksheet.mergeCells('A1:D3');
      worksheet.getRow(1).font = {
        name: 'Arial Black',
        bold: true,
      };
      worksheet.columns = rowHeader;
      worksheet.addRows(dataTableRows);

      workbook.xlsx.writeBuffer().then(data => {
        const blob = new Blob([data], {
          type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
        });

Alternatively, I could do this hack, but I don't know how to do this dynamically:

worksheet.addRow([rowHeader[0].key, rowHeader[1].key, rowHeader[2].key]);

Answer 1

https://github.com/exceljs/exceljs/issues/433 row headers looks like this:

const rowHeader = [
  { key: 'xxx' },
  { key: 'adsff' },
  { key: 'ff' },
  { key: 'ffff' },
  { key: 'sdfasdf' },
  { key: 'fasdfads' },
  { key: 'fasdfasdf' },
  { key: 'fasdfadf' },
  { key: 'fasdfawsdft' },
];
const imageId2 = workbook.addImage({
            base64: myBase64Image,
            extension: 'png',
          });
          worksheet.addImage(imageId2, 'A1:D3');
          worksheet.mergeCells('A1:D3');
          worksheet.addRow({});
          const col: string[] = [];
    
          rowHeader.forEach(header => {
            col.push(header.key);
          });
          const columnHeaders: string[] = Object.values(col);
          worksheet.getRow(5).values = columnHeaders;
          worksheet.getRow(5).font = {
            name: 'Arial Black',
            bold: true,
          };
          worksheet.columns = rowHeader;
          worksheet.addRows(dataTableRows);
    
          workbook.xlsx.writeBuffer().then(data => {
            const blob = new Blob([data], {
              type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
            });
            const a = window.document.createElement('a');
            const downloadUrl = window.URL.createObjectURL(blob);
            a.href = downloadUrl;
            a.download = `${fileName}.xlsx`;
            document.body.appendChild(a);
            a.click();
            document.body.removeChild(a);
            window.URL.revokeObjectURL(downloadUrl);
          });