使用 toDataURL() 将画布转换为图像并添加到 pdf



I implement:

<script type="application/javascript" src="js/html2canvas.js"></script>
<script type="application/javascript" src="js/jspdf.debug.js"></script>

两者都是最新版本。我有:

$(document).ready(function () {
        $('#down_but').click(function() {
            html2canvas(document.getElementById("node")).then(canvas => {
                const img = canvas.toDataURL("image/jpeg",1);
                const pdf = new jsPDF();
                pdf.addImage(img,"jpeg",5,5,205,292);
                pdf.save("file.pdf");
            });
        });
    });

当我只是将一些文本而没有添加图像到 pdf 时,pdf 会打开并下载。但是当我使用画布到数据网址时,什么也没发生。我真的不知道为什么。我尝试从另一个问题中复制和粘贴代码,但它们都不适合我。当我单击id="down_but"的下载按钮时,它只会在开发控制台中给出错误。

请参阅控制台错误图像

我尝试任何事情,但没有任何帮助。如果有人知道问题在哪里,请帮助我。我也为它创建了JSFiddle。

添加 html2canvas 的最新版本.js

https://html2canvas.hertzen.com/dist/html2canvas.js

JSfiddle

最新更新