从javascript库生成优质pdf的问题：jspdf和html2canvas

那么，我正在研究一个产生pdf输出的实用工具。数据是从用户提取的，经过一些操作转换为预定义的格式，然后以.pdf格式需要，所有css都完好无损。从javascript库生成优质pdf的问题：jspdf和html2canvas

它是一个完全客户端应用程序。

我为此使用jsPdf + html2canvas。但我有以下担忧：

首先，也找不到任何API文档。我仍在使用各种网站上发现的代码。无论如何，我已经实现了产量的质量远未达到预期。
当我的HTML文档大到可以占用多个页面时，我仍然只获得第一页的pdf。（这个，我猜是因为我缺乏知识，再次是因为缺少文档。）

我看过了，还有很多类似的问题。我尝试了几乎所有的人，几乎没有人工作，很少触发一些错误，我仍然卡住。

所以我的查询：

是我的选择，适合生产优质PDF（它是如何在屏幕上可见ATLEAST 80％-90％）。如果有人能够指导我使用jspdf和html2canvas的高质量输出作品，我们将会非常感激。
请指导有关这些库的正确文档。我目前所拥有的doc文件夹是在github中的zip文件中提供的，这当然不足以充分利用它。
如果这种方法不可行，请直接更好的产品。质量是我们的首要要求，性能可以协商。准备好付费图书馆。但更喜欢客户端工具（因为实际上不需要服务器端实现）。

我张贴上面的查询问题，但万一需要，我的代码：

function previewCtrlFn($scope, Database){ 
     var vm = this; 
     vm.resume = Database.resume; 
     console.log(angular.toJson(vm.resume)); 
     vm.pdf = createPDF; 

     var form = $('#aa'), 
      width = form.width(), 
      a4 =[ 615.28, 841.89]; 

     function createPDF(){ 
     getCanvas().then(function(canvas){ 
      var 
      img = canvas.toDataURL("image/png"), 
      doc = new jsPDF({ 
        unit:'px', 
        format:'a4' 
       });  
     doc.addImage(img, 'JPEG', 5, 5); 
     doc.save('resume.pdf'); 
     form.width(width); 
     }); 
     } 

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

我真的需要这方面的一些快速帮助。

来源

2016-07-26 Saurabh Tiwari

您可以使用此代码，您的PDF的大小和质量将提高

html2canvas(body,{ 
    onrendered:function(canvas){ 
     var img=canvas.toDataURL("image/png"); 
     console.dir(canvas); 
     var pdf=new jsPDF("p", "mm", "a4"); 
     var width = pdf.internal.pageSize.width;  
     var height = pdf.internal.pageSize.height; 
     pdf.addImage(canvas, 'JPEG', 0, 0,width,height); 
     pdf.save('test11.pdf'); 
    } 
})

来源

2016-09-09 12:18:13

从javascript库生成优质pdf的问题：jspdf和html2canvas

回答

相关问题