html2pdf reduces font quality

[Tamagotchi9]

This method takes html canvas (previously rendered PDF file with other lib) and generates new PDF with bad quality of text:

canvasToBase64Pdf (element, width, height) { const options = { image: { type: 'jpeg', quality: 1 }, html2canvas: { scale: 1 }, jsPDF: { orientation: width > height ? 'landscape' : 'portrait' } } return window.html2pdf() .from(element) .set(options) .outputPdf('datauristring') .then(result => result) }

I tried increasing scale in html2canvas and many other configs of html2canvas and jsPDF options, nothing works well for me. This screenshots show diffrence between quality before (first screenshot) and after (second screenshot) usage of html2pdf. Do you know how can I change my approach in order to achieve better quality ?

[R1D3R175]

I don't mean to be rude but some simple googling would've shown what you are looking for, for the next times please avoid opening issues before doing proper research. Do it for the maintainers :)

Anyway, check out this SO question and #478. I had an issue similar to yours and I fixed it by adding the following code

html2pdf()
  .set({
    margin: [10, 20],
    html2canvas: {
      scale: 4,
      letterRendering: true,
    },
  })
  .from(pdfData.templateHtml)
  .outputPdf('arraybuffer') as Promise<ArrayBuffer>,

Here's a comparision. The content in the upper page is native text, the content on the bottom page is the output of html2pdf.js.

Without .set	With .set

Close this issue if it has been solved with this solution.