• Jobs
  • About Us
  • Jobs
    • Home
    • Jobs
    • Courses and challenges
  • Businesses
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Hire tech talent
    • Blog
    • Sales
    • Salary Calculator

0

774
Views
Cómo agregar una imagen con pdfmake

Necesito agregar una imagen en el encabezado del informe generado por pdfmake. Pero al seguir la documentación no puedo hacer esta inserción, ni siquiera al convertir la imagen a base64. Por favor sugiera otra solución

Lo que fue hecho:

 import pdfMake from 'pdfmake/build/pdfmake'; import pdfFonts from 'pdfmake/build/vfs_fonts'; function epiPDF(epis){ pdfMake.vfs = pdfFonts.pdfMake.vfs; const header = [ { text: 'Description equipament', bold: true, fontFamily: 'Roboto', decoration: 'underline', margin: [0, 20, 0, 0], alignment: 'center', image: 'data:image/jpeg;base64,/9j/END_DATAURL_BASE64' } ]; function Rodape(currentPage, pageCounf){ return [ { text: currentPage + ' / ' + pageCounf, alignment: 'right', fontSize: 9, margin: [0, 10, 20, 0] } ] } const docDefinitios = { pageSize: 'A4', pageMargins: [10, 50, 10, 40], header: [header], content: [infor, rec, details], footer: [Rodape] } pdfMake.createPdf(docDefinitios).download(); } export default epiPDF;

cuando probar el código base64 es correcto

almost 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

¿Podría indicar cuáles son los errores del navegador?

También le sugiero que intente nuevamente con la imagen codificada en base64 especificada en el patio de recreo de pdfmake

almost 4 years ago · Juan Pablo Isaza Report

0

  1. El encabezado y el pie de página de su docDef deben ser funciones en lugar de matrices.

  2. Los elementos de Pdfmake tienen una estructura específica, por ejemplo, un elemento de texto no puede tener una imagen (deben ser 2 elementos separados).

Su código debería ser algo como esto:

 const getHeader = (currPage, totalPage) => [ { text: 'Description equipament', bold: true, fontFamily: 'Roboto', decoration: 'underline', margin: [0, 20, 0, 0], alignment: 'center', image: 'data:image/jpeg;base64,/9j/END_DATAURL_BASE64' }, { image: 'data:image...YOUR IMAGE', margin: [0, 20, 0, 0], alignment: 'center', } ] const docDefinitios = { pageSize: 'A4', pageMargins: [10, 50, 10, 40], header: getHeader, content: [infor, rec, details], footer: Rodape }

Salud

almost 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!