使用html2canvas和jspdf创建高质量的PDF

时间:2018-12-03 07:41:16

标签: angular pdf-generation jspdf html2canvas html-to-pdf

目前,我正在从事必须从html开发pdf的项目。我在前端使用Angular 5。我一直在尝试使用两个库html2canvas和jspdf创建高质量的pdf。但没有运气。

我已经创建了我要从中制作pdf的div,并使用以下代码创建了pdf。 pdf的质量非常模糊,无法接受。

html2canvas(sourceElement, { scale: 2 }).then((canvas) => {
      // console.log("the value of canvas is: ", canvas);
      // console.dir(canvas);
      const imgWidth = 208;
      const pageHeight = 295;
      const imgHeight = canvas.height * imgWidth / canvas.width;
      const heightLeft = imgHeight;
      const contentDataURL = canvas.toDataURL('image/png')
      let pdf = new jspdf('p', 'mm', 'a4'); // A4 size page of PDF
      var position = 0;
      pdf.addImage(contentDataURL, 'PNG', 0, position, imgWidth, imgHeight);
      pdf.save('MYPdf.pdf'); // Generated PDF
    });

请提供一些文章或代码示例,以帮助我解决此问题。我还没有发现任何文章可以很好地解释我pdf是如何生成的以及如何使它高质量。

类似的问题:

创建pdf时应如何隐藏div而不显示html? 已使用的可见性:无和不透明:0.0

0 个答案:

没有答案