javascript - JsPDF addImage jpeg 背景为黑色

Question

我使用 JsPDF 库并且遇到问题，当我使用 addImage 格式“JPEG”时，我的背景是黑色的。为什么是这种格式？因为当我在保存 12 个图表 = 100 MB++ 后使用格式“PNG” - 大小文件 PDF 时。我看到了所有问题，但没有找到确切的答案。
我的功能如下所示:

<canvas id = 'myCanvas'></canvas>

var doc = new jsPDF('p','pt', 'a2');
var canvas = document.querySelector('#myCanvas');
var canvasImg = canvas.toDataURL('image/JPEG');
doc.addImage(canvasImg,'JPEG', 70,700,1000,300 ); //left, from above, width, height
doc.addHTML($(id_page),function(){
  doc.save('test.pdf');
});

这是默认模板，但我尝试添加更多样式，包括“setFillColor” - 没用!尝试添加带有“destination-over”的白色 Canvas ，好主意，但是......实现，今天 2018 年，可能是谁找到了工作解决方案，我真的希望至少有一些工作信息。非常感谢。

Answer 1

PNG 支持 alpha channel (透明度)，而 JPEG 不支持。

一种解决方法是在导出之前用您喜欢的任何背景颜色填充 Canvas 。

创建 Canvas 之后，在调用 Chart.js 绘制图表之前，创建一个上下文并用您喜欢的任何颜色填充整个 Canvas 。

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "white";
ctx.fillRect(0, 0, canvas.width, canvas.height);