无法使用jspdf将图像添加到pdf.返回getJpegSize错误

Question

我在使用jspdf添加图像到pdf时遇到麻烦。我得到的错误如下:错误:getJpegSize无法找到图像的大小

代码如下:

$scope.makePDF = function () {
    var imgData = 'data:image/jpeg;base64,' + btoa('../img/myImage.jpg');
    var doc = new jsPDF();
    doc.setFontSize(12);
    doc.addImage(imgData, 'JPEG', 15, 40, 180, 180);

Answer 1

这里的问题是您没有加载图像数据。"btoa"从'./img/myImage.jpeg'中创建一个Base64编码的ASCII字符串。

要获得图像数据，您需要从画布或从物理图像创建图像数据。

改变

var doc = new jsPDF();
doc.setFontSize(12);
doc.addImage(imgData, 'JPEG', 15, 40, 180, 180);

var img = new Image(),
    canvas = document.createElement("canvas"),
    ctx = canvas.getContext("2d");
img.onload = function () {
    ctx.drawImage(img, 0, 0 );
    var imgData = canvas.toDataURL('image/jpeg');
    var doc = new jsPDF();
    doc.setFontSize(12);
    doc.addImage(imgData, 'JPEG', 15, 40, 180, 180);
}
img.src = '../img/myImage.jpg';

Answer 2

我有同样的错误，但刚刚解决了它。我不认为我的问题和Jason的一样，但也许它会帮助其他人解决类似于我的问题。我的问题是由于我指定了'img'而不是'image':

var imgData = canvas.toDataURL("img/jpeg", 1.0);

这花了我一点尝试和错误来弄清楚，因为控制台没有抱怨"img"，我习惯在其他上下文中将image缩写为img，所以我一定是太笨了。同样，您还需要确保指定jpeg而不是jpg。