ウェブページをスタイルでPDFに変換する

Question

私が追加したすべてのスタイルを含むWebページをPDFに変換したい。 私はjspdf.jsとhtml2Canvasを使用しました。しかし、私はPDF形式でぼやけた画像しか得ていません。 多くのJavaScriptコードを検索しましたが、正しいコードが見つかりませんでした。

私が書いたスクリプトは次のとおりです。

function getPDF() { 
 
    html2canvas(document.body, { 
 
    onrendered: function(canvas) { 
 
     var img = canvas.toDataURL("Image/jpeg"); 
 
     //window.open(img); 
 
     var doc = new jsPDF({ 
 
     unit: 'px', 
 
     format: 'a4' 
 
     }); 
 
     doc.addImage(img, 'JPEG', 0, 0, 440, 627); 
 
     doc.save("download"); 
 

 
    } 
 
    }); 
 
}

はありがとうございました！

Answer 1

寄与しているものがいくつかあります。

canvas.toDataURLのエンコーダオプションがないため、デフォルト値を取得しています。デフォルトでは、低画質の画像が作成されている可能性があります。最高品質のJPEG画像のためにこれを試してみてください：

var img = canvas.toDataURL("Image/jpeg", 1.0); 

あなたはまた、あなたのjsPDF測定とオブジェクトではなく、ピクセルを作成してみてください：

var pdf = new jsPDF("p", "mm", "a4"); // jsPDF(orientation, units, format) 

そして、あなたは画像を追加、寸法にそれを拡大ページの：

pdf.addImage(imgData, 'JPEG', 10, 10, 190, 277); // 190x277 mm @ (10,10)mm 

これは、より良い画像品質を実現するかどうかを確認します。