jsPDF - HTMLページをPDFに正確に取り込む

Question

私は、pdfとして印刷するテーブルが必要で、テーブルに結び付けられたCSSを却下しないでください。私はangularjsも使用しています。私はさまざまな方法を見ており、jsPDFを試しています。

メインページ（rollup.html）には、pdfとして表をエクスポートするリンクがあります。コントローラ内のJS（rollup.js）において

<a style="float: right;" href="genPDF()">PDF TEST</a> 

、Iは、ID #testDiv内に含まれるものは何でも表示する必要genPDF機能を有しています。もちろん

app.controller('Rollup', function($scope, $rootScope, $http, $uibModal, headersvc, locFiltersvc) { 
.... 
function genPDF(){ 
    html2canvas(document.getElementById("testDiv"), { 
     onrendered: function (canvas) { 
      var img = canvas.toDataURL("image/png"); 
      var doc = new jsPDF(); 
      doc.addImage(img, 'JPEG',20,20); 
      doc.save('test.pdf'); 
     } 
    }); 
} 
}); 

私は

<div class="content-div" style="overflow: visible;" id="testDiv"> 
.... 
</div> 

（route.htmlに位置しています）私は印刷するテーブルを含むdiv要素にtestDivを割り当て、私はAを使用して残りのタブのために働く別のボタンを持っていますcssなしでよりシンプルな他のテーブルのデータをクリックしてブロードキャストします。私がng-clickを使用してテーブルを印刷し、テーブルデータをブロードキャストしようとすべきかどうかは確かではありませんが、すべてのCSSも同様です。

 <li style="float: right;">  
      <button ng-click="printDiv('rollup-tab')">Printer Friendly</button> 
     </li> 

コンソールにjsPDFメソッドのエラーが表示されていないため、問題の内容が不明です。どんな助けもありがとうございます。ありがとう

Answer 1

このlinkを介してGitHubのjsPDF - AutoTableライブラリを調べることを強くおすすめします。私は最近あなたと非常に似たようなシナリオに遭遇し、CSSを維持するのが難しいことが判明しました。このソリューションは、多くのユースケースに最適で、jsPDFを単独で使用するよりもはるかに効率的かつ効果的に私の問題を解決しました。お役に立てれば！