Export to PDF and XLSX does not include background images

Export to PDF and XLSX does not include background images

Posted by: adrian.szulc on 15 July 2024, 9:38 am EST

• 

  adrian.szulc

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 15 July 2024, 9:38 am EST

  sheet.getCell(1, currentColumn).backgroundImage(item.thumbnail);

  When I export a workbook:

  const onExportFile = (type: string) => {
      const date = format(new Date(), config.dateFormat);
      const fileName = `Export_${date}.${type}`;
      if (type === ExportFileOptions.XLSX) {
        comparisionSpread?.export(
          function (blob: Blob) {
            saveAs(blob, fileName);
            addToast({ id: uuid(), message: t('exportFileSuccess') });
          },
          exportFileErrorCallback,
          exportXlsxOptions,
        );
      } else if (type === ExportFileOptions.PDF) {
        comparisionSpread?.savePDF(function (blob: Blob) {
          saveAs(blob, fileName);
          addToast({ id: uuid(), message: t('exportFileSuccess') });
        }, exportFileErrorCallback);
      }
    };

  there is no background image. When I use base64 format:

  sheet.getCell(1, currentColumn).backgroundImage("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAApgAAAKYB3X3/OAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAANCSURBVEiJtZZPbBtFFMZ/M7ubXdtdb1xSFyeilBapySVU8h8OoFaooFSqiihIVIpQBKci6KEg9Q6H9kovIHoCIVQJJCKE1ENFjnAgcaSGC6rEnxBwA04Tx43t2FnvDAfjkNibxgHxnWb2e/u992bee7tCa00YFsffekFY+nUzFtjW0LrvjRXrCDIAaPLlW0nHL0SsZtVoaF98mLrx3pdhOqLtYPHChahZcYYO7KvPFxvRl5XPp1sN3adWiD1ZAqD6XYK1b/dvE5IWryTt2udLFedwc1+9kLp+vbbpoDh+6TklxBeAi9TL0taeWpdmZzQDry0AcO+jQ12RyohqqoYoo8RDwJrU+qXkjWtfi8Xxt58BdQuwQs9qC/afLwCw8tnQbqYAPsgxE1S6F3EAIXux2oQFKm0ihMsOF71dHYx+f3NND68ghCu1YIoePPQN1pGRABkJ6Bus96CutRZMydTl+TvuiRW1m3n0eDl0vRPcEysqdXn+jsQPsrHMquGeXEaY4Yk4wxWcY5V/9scqOMOVUFthatyTy8QyqwZ+kDURKoMWxNKr2EeqVKcTNOajqKoBgOE28U4tdQl5p5bwCw7BWquaZSzAPlwjlithJtp3pTImSqQRrb2Z8PHGigD4RZuNX6JYj6wj7O4TFLbCO/Mn/m8R+h6rYSUb3ekokRY6f/YukArN979jcW+V/S8g0eT/N3VN3kTqWbQ428m9/8k0P/1aIhF36PccEl6EhOcAUCrXKZXXWS3XKd2vc/TRBG9O5ELC17MmWubD2nKhUKZa26Ba2+D3P+4/MNCFwg59oWVeYhkzgN/JDR8deKBoD7Y+ljEjGZ0sosXVTvbc6RHirr2reNy1OXd6pJsQ+gqjk8VWFYmHrwBzW/n+uMPFiRwHB2I7ih8ciHFxIkd/3Omk5tCDV1t+2nNu5sxxpDFNx+huNhVT3/zMDz8usXC3ddaHBj1GHj/As08fwTS7Kt1HBTmyN29vdwAw+/wbwLVOJ3uAD1wi/dUH7Qei66PfyuRj4Ik9is+hglfbkbfR3cnZm7chlUWLdwmprtCohX4HUtlOcQjLYCu+fzGJH2QRKvP3UNz8bWk1qMxjGTOMThZ3kvgLI5AzFfo379UAAAAASUVORK5CYII=");

  I can see the image in PDF (with dropped image quality), but not in XLSX file. Is this the only way to display images on export?

• 

  priyam.kushwaha

  

  • Post Options:
  • Link
    Copy

  Posted 16 July 2024, 6:46 am EST

  Hi,

  Exporting a background image of the cell to Excel is a specific feature of SpreadJS and is not supported by Excel. Please refer to the following doc for a list of cell settings which are supported during excel export: https://developer.mescius.com/spreadjs/docs/excelimpexp/excelexport/excelcellex

  Regarding the issue with image quality in PDFs, this is a limitation of the current implementation. SpreadJS uses Canvas to render everything in sheets. When generating a PDF, all images are rendered using the Canvas API, which results in pixelated images even if use vector images.

  Regards,
  
  Priyam

• 

  adrian.szulc

  • Post Options:
  • Link
    Copy

  Posted 16 July 2024, 9:04 am EST - Updated 16 July 2024, 9:11 am EST

  Thank you for the response.