Problemas al crear PDF con jsPDF Tengo un documento en html que deseo convertir a pdf. El html es mas o menos así:
...
Código:
el numero de divs varía.<body> <div class="hoja_pdf pdf_0">...</div> <div class="hoja pdf_1">...</div> <div class="hoja pdf_2">...</div> </body>
El problema que tengo es que a la hora de generarse el PDF no crea todas las páginas, se salta algunas. Esto varía cada vez que se crea el PDF, no siempre crea las mismas, pero casi nunca crea el documento completo. No soy experto en JS, el código es el siguiente:
Código:
De antemano gracias. var hpdf = null, doc =null;
$("#btn_pdf").on("click", function() {
doc = new jsPDF({
unit : 'in',
format : 'letter',
orientation : 'landscape'
});
$("body").scrollTop(0);
new Promise(function(done) {
doc_length = $(".hoja_pdf").length;
var imgs = new Array();
$.each($(".hoja_pdf"), function(x,y) {
hpdf = $(".pdf_" + x);
get_canvas().then(function(canvas) {
imgs[x] = canvas.toDataURL("image/png");
if (imgs[x] != null && x == (doc_length - 1) ) {
console.log("imagenes obtenidas")
done(imgs);
}
})
})
}).then(function(imgs) {
return new Promise(function (done) {
var total_imgs = imgs.length;
console.log(total_imgs);
console.log("Creando las páginas...");
for (i in imgs) {
console.log(i + " de " + total_imgs);
add_image(imgs[i], function () {
if (imgs[i] != null) {
if (i < (total_imgs - 1)) {
doc.addPage();
console.log("Hoja " + i + " añadida");
}
if (i == (total_imgs - 1)) {
console.log("Imagenes agregadas");
done("Proceso terminado");
}
} else {
console.log("No se pudo agregar la imagen, es nula")
}
});
}
});
}).then(function(msg) {
console.log(msg);
doc.save("generados.pdf");
})
});
function add_image(img,callback) {
if (img != null) {
doc.addImage({
imageData : img,
format : "JPEG",
x : 0.05,
y : 0.05
});
callback();
} else {
console.log("Error al agregar la imagen");
}
}
function get_canvas() {
hpdf.width(1010).css("max-width", "none");
hpdf.height(770);
return html2canvas(hpdf, { imageTimeout: 2000, remove: true});
}
