2017-02-16 2 views
0

Я использую jsPdf и html2pdf для преобразования html в pdf-файл.jspdf конвертировать html в pdf с несколькими страницами

Я могу преобразовать тон html и загрузить файл, но если html слишком большой, чтобы вписаться на одну страницу, он не создает другие страницы, как это сделать?

код:

var pdf = new jsPDF('l', 'pt', 'a4'); 
pdf.canvas.height = 72 * 11; 
pdf.canvas.width = 72 * 8.5; 
html2pdf(document.getElementById(id), pdf, function(pdf){ 
    pdf.save('file.pdf'); 
}); 

ответ

1

Если выше ответ не работает я сделал это так:

скачать и включить в порядке:

  1. Jquery
  2. html2canvas
  3. jspdf

google они легко найти. затем введите свой код для печати в отчете об упаковке div. и вызовите функцию с помощью кнопки печати. , например (в jsfiddle код не будет работать, потому что он не позволяет внешнего кода из не объектов ТПС, но он будет работать на сервере)

$(document).ready(function() { 
    var form = $('#report'); 
    var cache_width = form.width(); 
    var a4 = [595.28, 841.89]; 


    $('#create_pdf').on('click', function() { 
    $('body').scrollTop(0); 
    createPDF(); 
    }); 

    //create pdf 
    function createPDF() { 
    getCanvas().then(function(canvas) { 
     var imgWidth = 200; 
     var pageHeight = 290; 
     var imgHeight = canvas.height * imgWidth/canvas.width; 
     var heightLeft = imgHeight; 
     var doc = new jsPDF('p', 'mm'); 
     var position = 0; 

     var img = canvas.toDataURL("image/jpeg"); 




doc.addImage(img, 'JPEG', 0, position, imgWidth, imgHeight); 
    heightLeft -= pageHeight; 



    while (heightLeft >= 0) { 
    position = heightLeft - imgHeight; 
    doc.addPage(); 
    doc.addImage(img, 'JPEG', 0, position, imgWidth, imgHeight); 
    heightLeft -= pageHeight; 
    } 


    doc.save('Report.pdf'); 
    form.width(cache_width); 
    }); 
} 


// create canvas object 
    function getCanvas() { 
    form.width((a4[0] * 1.33333) - 80).css('max-width', 'none'); 
    return html2canvas(form, { 
     imageTimeout: 2000, 
     removeContainer: false 
    }); 
    } 

}); 

https://jsfiddle.net/vnfts73o/1

Смежные вопросы