javascriptライブラリから品質の良いpdfを生成する際の問題：jspdfとhtml2canvas

Question

私はpdf出力を生成するユーティリティツールを開発しています。データはユーザから取り出され、ある操作の後に、すべてのcssがそのままの状態で.pdf形式で必要とされる予め定義されたフォーマットに変換される。

完全にクライアント側のアプリケーションです。

私はこれにjsPdf + html2canvasを使用しています。しかし、私は心配しています：

1. 最初に、APIドキュメントは見つかりませんでした。私はいろいろな場所で見つかったコードの一部を使っています。
2. 何と言っても、出力の品質は期待通りではありません。
3. 私のHTML文書が複数のページを占有するのに十分な大きさであれば、私はまだ最初のページのみのpdfを取得できます。 （これは私が知識が不足していることが原因だと思います。文書の不足によるものです。）

私はこれまでに多くの類似の質問があります。私はそれらのほとんどすべてを試しました、少ししか動作しない、いくつかのエラーを引き起こすものはほとんどなく、私はまだまだ立ち往生しています。

だから私のクエリ：

1. は良い品質のPDF（それが画面上に表示されているかの少なくとも80％-90％）を製造するのに適した、私の選択です。誰かが私をjspdfとhtml2canvasの良質な出力の部分に向けることができれば本当に感謝します。

2. これらのライブラリに関する適切なドキュメントを参照してください。私が現在持っているのはdocのフォルダで、zipのgithubのファイルに沿って提供されています。

3. この方法が実現できない場合は、より良い製品をご利用ください。品質は私たちにとって最高のノッチ要件であり、パフォーマンスは交渉することができます。有料ライブラリの準備が整いました。しかし、クライアントサイドのツール（文字通り、サーバ側の実装が不要なため）を好む。

私は上記のクエリのために質問を投稿が、念のために必要な、私のコード：

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 
      }); 
     } 
    } 

私は本当にこの上でいくつかの簡単な助けを必要としています。

Answer 1

あなたはこのコードを使用することができ、あなたの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'); 
    } 
}) 

を改善します