Mostrando entradas con la etiqueta exportjs. Mostrar todas las entradas
Mostrando entradas con la etiqueta exportjs. Mostrar todas las entradas

jueves, 28 de julio de 2022

Exportar Imagen en Excel JS

 Hola a todos, en este momento aremos un archivo de excel a partir de la informacion en un arreglo de propiedades, entre estas propiedades estará una constante con images en base64.
Para ello utilizaremos las librerias de exceljs.js y FileSaver.js puedes acceder a estas librerías en las siguientes direcciones.


<script src="https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.21.15/plugins/export/libs/FileSaver.js/FileSaver.min.js" type="text/javascript"> </script>
 <script crossorigin="anonymous" integrity="sha512-UnrKxsCMN9hFk7M56t4I4ckB4N/2HHi0w/7+B/1JsXIX3DmyBcsGpT3/BsuZMZf+6mAr0vP81syWtfynHJ69JA==" referrerpolicy="no-referrer" src="https://cdnjs.cloudflare.com/ajax/libs/exceljs/4.3.0/exceljs.min.js"> </script>


A partir de aquí lo que sigue es preparar nuestra información.

  var arreglo = [{ name: "Jane Doe",foto:'data:image/png;base64,/9j/4QAYRXhpZgAAS...'},{ name: "John Doe",foto:'data:image/png;base64,/9j/4QAYRXhpZgAAS...'}];
 var cols= [{field:'name',title:'Nombre'},{field:'foto',title:'IMAGEN'}];
  
Una vez que tenemos el insumo creamos nuestra función.
  async function exportFile(arry,cols,fileName){
     var workbook = new ExcelJS.Workbook();
     workbook.creator = 'inovania.blogspot.com';
     workbook.lastModifiedBy = 'inovania.blogspot.com';
     workbook.created = new Date();
     var worksheet =  workbook.addWorksheet('Sheet 1');
     var grd={
          columns:cols,
          data:array
     };
     var arrRow=[];
     grd.columns.map((e,i) => {
          arrRow.push(e.title);
     });
     worksheet.addRow(arrRow);
     for(var e=0;e<grd.data.length;e++){
          var arrDt = [];
          var logo;
          for(var x=0;x<grd.columns.length;x++){
               var c = grd.columns[x].field;
               if(x==0){
                    logo = workbook.addImage({
                         base64: grd.data[e][c],
                         extension: 'jpg',
                    });
                    arrDt.push("");
               }else{
                    arrDt.push(grd.data[e][c]);
               }
          }
          worksheet.addRow(arrDt);
          worksheet.addImage(logo, ('A'+(e+2)+":"+"A"+(e+2)));
     }
     await workbook.xlsx.writeBuffer()
          .then(buffer => saveAs(new Blob([buffer]),fileName+".xlsx"))
          .catch(err => console.log(err) );
};
  
Con esto solo nos queda el llamado el cual queda de la siguiente manera

  exportFile(arreglo,cols,"archivoInnovania");
De esta manera queda nuestro objeto capas de exportar imagenes en base64 en un archivo de excel.

Cabe mencionar que la función worksheet.addImage(img,rango); ocupa dos parámetros el primero es la imagen y el segundo parámetro es un rango de celdas, en este caso lo deje en la misma celda, pasándole como rango desde la celda ( A1 hasta la celda A1) A1:A1, simulando que este será un rango de celdas.


Quedo en espera de sus comentarios, hasta la proxima.