Monday, November 28, 2016

jsPDF - how to use, updated to December 2016







The following is an example of how to  implement the jspdf.js library in order to create PDF pages  out of the current website.


The JS libraries needed  can be downloaded here:

jspdf.min.js     html2canvas.js


Please contact me or write down your comment  if you find any bugs.


<script  type="text/javascript" src='jspdf.min.js'></script>

 <script  type="text/javascript" src='html2canvas.js'></script>


<script type="text/javascript">


function genPDF()

{


 html2canvas(document.body, {


  onrendered : function(canvas)

    { 

     try

       {     

        var canvas1 = document.createElement('canvas');

        canvas1.width = canvas.width;    canvas1.height = canvas.height;

        var context1 = canvas1.getContext('2d');     

        context1.drawImage(canvas, 0,0);

        options = {orientation: "0", unit: "mm",format: "a4" };     

        var doc = new jsPDF(options,'p', 'pt', 'a4');  

        var number_needed_pages = canvas.height / 900;

        if(number_needed_pages < 1) number_needed_pages = 1; 

        for(var x=0; x < number_needed_pages ; x++) 

        {  

         var canvas2 = document.createElement('canvas');  

         canvas2.width = 794; canvas2.height = 900;  

         var context2 = canvas2.getContext('2d');    

         context2.drawImage(canvas1, 0 , 0 + 900*x , canvas1.width, canvas2.height, 50, 0,  canvas.width, canvas2.height); 

        doc.addImage(canvas2.toDataURL('image/png'), 'JPEG', '', '', '');  

        doc.addPage();

        }  

 

    doc.save("output_file.pdf");  

      } catch(e){alert(e);} 

  

    }




                            });



}



No comments:

Post a Comment