0
129
Vistas¿Cómo se puede organizar el texto y el logotipo correctamente?
Quería tener el logotipo en el lado izquierdo de la palabra "Título", pero actualmente está en la parte inferior de la página. Y el texto "Muestra" está cubierto por la tabla. ¿Cómo puedo reorganizar este texto e imágenes correctamente?
Lo recreé aquí: https://codesandbox.io/s/js-pdf-with-data-printable-from-displayed-data-lup6ir?file=/src/App.js
Códigos:
const handlePrint = () => { console.log("clicked"); const doc = new jsPDF(); var img = new Image(); img.src = require("./assets/logo-social.png"); img.onload = () => { // await for the image to be fully loaded doc.addImage(img, "png", 10, 78, 12, 15); doc.text("Title here", 20, 10); doc.text("Sample", 20, 15); const columns = ["Data"]; const rows = []; data.map((item) => rows.push([ item.cartItems.map( (item) => `${item.name}: ${item.color} = ${item.quantity}` ) ]) ); doc.autoTable(columns, rows); doc.save("order.pdf"); }; };
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Use la devolución de llamada didDrawPage de autoTable , así:
var finalY = doc.lastAutoTable.finalY || 10; ... doc.autoTable(columns, rows, { startY: finalY + 20, showHeader: "never", didDrawPage: function (data) { // Header doc.setFontSize(20); doc.setTextColor(40); doc.text("Title here", data.settings.margin.left + 21, 22); doc.text("subtittle here", data.settings.margin.left + 21, 28); doc.addImage(img, "png", 10, 15, 25, 15); } });Aquí hay un ejemplo de trabajo.
·
Juan Pablo Isaza
Denunciar
Responde la pregunta