jsPDF与html2canvas生成的pdf模糊不清？

Question

我目前正在使用html2canvas将一个div的内容转换为png格式，但是使用scale: 5或dpi:等参数对生成的图片质量没有任何影响。

这是html2canvas的结果，因为我在pdfcon()函数中添加canvas，它非常模糊 :)

我已经在互联网上搜寻了答案，但毫无所获，希望能得到帮助 :)(我还在使用Quill编辑器)

HTML:

    <div id="editorOne" class="pdf-convert ql-container ql-snow">
        <div id="specialEdit" class="ql-editor" data-gramm="false" contenteditable="false">
            <?php echo stripslashes($newClean); ?>
        </div>
    </div>
    <button onclick="pdfcon()">Save Pdf</button>

JS：

function pdfcon() {
                html2canvas($("#editorOne"), {
                    scale: 5,
                    onrendered: function (canvas) {
                        document.body.appendChild(canvas);
                        var img = canvas.toDataURL("png");

                        var doc = new jsPDF("p", "mm", "a4");

                        var width = doc.internal.pageSize.getWidth();
                        var height = doc.internal.pageSize.getHeight();

                        doc.addImage(img, 'PNG', 0, 0, width, height);
                        doc.save('testing.pdf');
                    }
                })
            };

- akemedis

Answer 1

你可以提高它的质量。在html2canvas中，你可以选择0-4级别的质量。 你需要将其作为参数添加到对象中。

html2canvas($("#editorOne"), {
                quality: 4,
                scale: 5,

但要注意，质量级别4会生成大约60MB大小的PDF文件。最好的选择是使用质量级别1或2。

- Keimeno

---

我按照你说的使用了高质量选项，但没有任何影响。另一个有趣的事情是，无论我做出什么更改（比例尺1-5、dpi、质量1-4），文件大小都没有受到任何影响，它们始终为1.91MB。 - akemedis

还有人遇到这个问题吗？html2canvas 模糊图像。 - Varkery

是的，我也一样.. 正在努力寻找答案 @>@ - Vnuuk