Tengo una tabla HTML básica que está estructurada así:
<style> .demo { border:1px solid #C0C0C0; border-collapse:collapse; padding:5px; } .demo th { border:1px solid #C0C0C0; padding:5px; background:#F0F0F0; } .demo td { border:1px solid #C0C0C0; padding:5px; } </style> <table class="demo"> <caption>Table 1</caption> <thead> <tr> <th>Header 1</th> <th>Header 2</th> <th>Header 3</th> </tr> </thead> <tbody> <tr> <td>hello</td> <td> World</td> <td><img width="150px" src="https://www.hdnicewallpapers.com/Walls/Big/Rainbow/Rainbow_on_Mountain_HD_Image.jpg" /></td> </tr> <tr> <td> 1</td> <td> 1</td> <td><img width="150px" src="https://www.hdnicewallpapers.com/Walls/Big/Rainbow/Rainbow_on_Mountain_HD_Image.jpg" /></td> </tr> <tr> <td> 2</td> <td> 2</td> <td><img width="150px" src="https://www.hdnicewallpapers.com/Walls/Big/Rainbow/Rainbow_on_Mountain_HD_Image.jpg" /></td> </tr> </tbody> </table>Si copia este código y lo pega en un documento HTML, encontrará los resultados como una tabla de 3x3 + encabezado. Las primeras 2 columnas tienen texto, la tercera tiene una imagen de 150 px de ancho. Funciona perfectamente cuando exporto como PDF, pero cuando exporto como Excel usando el siguiente método:
<a href={'data:application/vnd.ms-excel,' + encodeURIComponent(document.getElementsByClassName("print-table-legacy")[0]?.outerHTML)} download={"Projects Report - " + getDateFromRange(filterOptions._date_range) + ".xls"} onClick={e => {}}>Export (With Pictures)</a> las imágenes parecen ser extremadamente grandes (tamaño original: si es 1920x1080 , sigue siendo ese tamaño ignorando mi regla css de 150px ).
Esta no es una solución viable para mi problema de incluir imágenes dentro de Excel. ¿De qué sirve tener las imágenes si tienes que revisar cada imagen y cambiar su tamaño? Estás mejor sin ellos en ese momento.
¿Hay alguna forma de cambiar el tamaño de la imagen real antes de exportarla a Excel? Estas imágenes se almacenan en un servidor remoto y cambiar su tamaño allí tampoco es una opción, ya que se necesitan los originales y el espacio de almacenamiento es un poco limitado.