使用jspdf库将html文件转换为pdf

时间:2016-10-30 03:07:53

标签: javascript html pdf canvas

我正在尝试使用jsPDF库将html文件转换为pdf。但是在我实现的代码中,整个图像并没有转换成pdf。只有一半是可见的。有人可以告诉我我哪里错了吗?

var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
context.beginPath();
context.moveTo(0,0);
context.lineTo(200,100);
context.closePath();
context.strokeStyle = '#0000ff';
context.stroke();

download.addEventListener("click", function() {
  // only jpeg is supported by jsPDF
 var imgData = canvas.toDataURL("image/jpeg",1.0);              
var pdf = new jsPDF();
 pdf.addImage(imgData, 'JPEG', 0, 0);

var download = document.getElementById('download');
  pdf.save("download.pdf");
});
<script src="https://parall.ax/parallax/js/jspdf.js"></script>
<canvas id="myCanvas" width="200" height="100" style="border:solid #0000ff;">
</canvas>
<button id="download">download</button>

1 个答案:

答案 0 :(得分:1)

我最近做了一些关于将html转换为pdfs的研究。我查看了jsPDF,但它似乎更适合将PDF文档嵌入到html页面中。

如果您希望将html页面导出为PDF,您可能需要考虑https://github.com/fraserxu/electron-pdf,这是我最终决定使用的内容。电子产生的输出符合“打印到pdf”的要求。 Chrome中的功能。

注意:这是服务器端呈现解决方案。如果你必须在客户端进行,那么它就不是正确的解决方案。