如何从 jspdf 页面中删除顶部/底部边框?

Question

我正在使用html2canvas，canvg和jspdf的组合来获取html内容(其中包含svg图形)并将它们转换为画布，然后用于创建pdf文件。为了防止一些不幸的分页问题，我发现最好的解决方法是创建多个画布，其中 1 个画布等于一页。然后在使用 jspdf 库之前使用 todataurl() 将画布转换为图像，除了 pdf 页面上的每个图像都有顶部和底部边框之外，它工作得很好。

这些边框不会显示在网页本身上，无论是在 html 上还是在画布上 - 它们只显示在生成的 pdf 上。除了这篇文章之外，我在谷歌上没有找到任何东西：html2canvas 和 toDataURL 生成的图像有水平线。有谁知道发生了什么以及如何删除这些边界？

-编辑：我应该补充一点，我尝试在画布上设置边框：无，但这没有帮助。我的div 也没有设置边框属性。使用的浏览器是IE 11，必须支持IE 10+(Chrome和其他不是选项)。

这是我用来生成 PDF 的代码：

function saveToCAMM(canvasArray) {
var numCanvas = canvasArray.length;
var imgWidth = 250;
var pageHeight = 360;
var canvasPDF = new jsPDF('l', 'mm', "letter");
for (var i = 0; i < numCanvas; i++) {
var canvas = canvasArray[i];
var canvasImg = canvas.toDataURL("image/jpeg", 1.0);
var imgHeight = canvas.height * imgWidth / canvas.width;
if (i != 0) { canvasPDF.addPage(); }
canvasPDF.addImage(canvasImg, 'JPEG', 15, 0, imgWidth, imgHeight);
}

canvasPDF.setDisplayMode("125%", "continuous");
}

示例：带边框的 PDF 页面

谢谢 阿曼达

Answer 1

我遇到了同样的问题：似乎 jpeg 图像在 canvas.toDataURL("image/jpeg"， 1.0) 函数中获得了黑色背景，正如所指出的那样：

https://ourcodeworld.com/articles/read/10/image-created-from-canvas-have-black-background-html5-

使用 canvas.toDataURL() 并基本上接受具有透明背景的 png 图像对我来说是这样。