Question

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

<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”-无用！尝试添加带有“目标位置”的白色画布，不错的主意，但是...意识到，今天是2018年，也许是谁找到了可行的解决方案，我真的希望至少能提供一些有用的信息。非常感谢。

Answer 1

PNG支持alpha通道（透明度），而JPEG不支持。

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

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

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

JsPDF addImage jpeg背景为黑色

1 个答案: