2016-07-04 6 views
0

jsPDFを使用して自分のページをPDFドキュメントに変換する方法を探していますが、今はCSSスタイルを変換できません。それは単なるテキストであり、グラフィックスではありません。CSSを含むHTMLへのPDFの添付

これは私が今

var specialElementHandlers = { 
     '#ignorePDF': function (element,renderer) { 
      return true; 
     } 
    }; 

    var doc = new jsPDF(); 

    doc.fromHTML($('#page-with-images').get(0), 20, 20, {'width': 500, 'elementHandlers': specialElementHandlers,}); 
    doc.save("Test.pdf"); 

で使用しています。しかし含め一切スタイリングがないので結果は、私が欲しいものではありませんコードです。この問題を解決するにはどうすればよいですか?

+1

。 –

答えて

0

これを試してください。あなたは、PDFのために特定のCSSスタイルを適用する必要が

var pdf = new jsPDF('p', 'pt', 'a4'); 
 
pdf.addHTML($("#content"), function() { 
 
    var output = pdf.output("datauristring"); 
 
    alert(output); 
 
    //pdf.output("datauri"); //This will output the PDF in a new window 
 
});
div { 
 
    width: 100%; 
 
    background-color: lightblue; 
 
    padding: 15px; 
 
    border: 2px solid black; 
 
} 
 

 
p { 
 
    background-color: limegreen; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.debug.js"></script> 
 

 
<body> 
 
    <div id="content"> 
 
    <div> 
 
     <div> 
 
     <div> 
 
      <div> 
 
      <p id="to-pdf">HTML content...</p> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</body>

+0

pdf文書のみ表示可能な要素(画面の高さ - 1000px、要素の高さ - 2000px(スクロールあり)) – Zhihar

+0

jsPDFを使った場合と同じくらい深くはありませんでした。 CSS。私はあなたが彼らの文書をチェックアウトする必要があります、多分それはあなたにリードを与えるでしょう。 – Jorrex

関連する問題