JsPDF 和 Chart.js：提高图表分辨率

Question

我编写了一些代码，在网页上显示两个 Chart.js 图表，然后允许用户使用 jsPDF 下载 pdf 格式的图表。问题是 pdf 中图表的分辨率取决于显示器的 dpi 设置。例如，当我使用工作电脑 (1080p) 创建 pdf 时，分辨率非常糟糕。然而，当我的同事使用我们的Macbook生成pdf时，图像非常清晰。

如何使图像独立于显示分辨率并始终生成高分辨率图像。我正在使用toDataURLwithaddImage将图像插入 PDF。

如果需要的话我也可以上传代码。

谢谢

Answer 1

正如 @HandDod 所写，DPI 就是解决方案！

由于 Chart.js 的一些版本具有参数 devicePixelRatio。默认情况下，画布按显示器的 DPI 数字渲染，因此 96 或 Retina - 不适合打印输出，但非常适合屏幕。

如果增加该值，则会创建更多像素。展开该值，以便您可以将打印质量的图表导出为 Base64 图像。该值不会影响监视器上图表的显示。

就我而言，我将该值设置为 1.5。

options:{
      devicePixelRatio: 1.5
}

文档： https: //www.chartjs.org/docs/3.0.2/configuration/device-pixel-ratio.html 效果非常好...