Javascript 使用JSPDF将画布图表导出为PDF

我使用jspdf导出画布图表和PDF格式的相关数据。我能够正确获取数据，但无法获取PDF格式的图表图像。下面是我的代码：

    var doc = new jsPDF();
    
    var canvas = document.getElementById('graph');
    var canvasImg = canvas.toDataURL();
    console.log(canvasImg);

    var rows = [];
    for (var i = 0; i < dataFFTvalues.length; ++i) {
        for (var j = 0; j < dataFFTvalues[i].length; ++j) {
            dataFFTvalues[i][j] = dataFFTvalues[i][j];
        }
        rows.push(dataFFTvalues[i]); //.join(',')
    }

    var img = new Image();
    img.src = 'http://domainname.com/portal/img/logo.png';

    img.onload = function(){
        doc.setFontSize(15);
        doc.addImage(img, 'PNG', 160, 5, 40 , 18);
        doc.text(90, 20, "Report");
        doc.setFontSize(10);
        doc.text(15, 40, "Below are the metric details : ");

        doc.autoTable(columns, rows, {startY: 85}); 
        doc.addPage();
        doc.internal.scaleFactor = 1.8;
        var width = doc.internal.pageSize.width;     
        doc.addImage(canvasImg, 'PNG', 5, 20, width-20, 70);
        doc.save('FFTcanvas.pdf');
    }

var doc=new jsPDF（）；
var canvas=document.getElementById（'graph'）；
var canvasImg=canvas.toDataURL（）；
控制台日志（canvasImg）；
var行=[]；
对于（变量i=0；i

行和徽标图像以PDF格式正确导出。但“拉票”并不是一片空白。“canvasImg”的控制台输出：

数据：图像/png；base64，IVBORW0KGGG0KGG0KG0KG0KG0KG0KG0KG0KG0K0KG0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0K0第四节，在第四节中，我们可以用一个简单的例子来说明这个问题asxgfgfqiecbaggqiaaqiecbaggqiaaqiaoq0qiecaaecbaggqiecaaecbaggqiaihpeb

---

期待您的建议和帮助。

通过更改某些代码解决了此问题：

var doc = new jsPDF();

var rows = [];
for (var i = 0; i < dataFFTvalues.length; ++i) {
    for (var j = 0; j < dataFFTvalues[i].length; ++j) {
        dataFFTvalues[i][j] = dataFFTvalues[i][j];
    }
    rows.push(dataFFTvalues[i]); //.join(',')
}

var img = new Image();
img.src = 'http://domainname.com/portal/img/logo.png';

img.onload = function(){
    doc.setFontSize(15);
    doc.addImage(img, 'PNG', 160, 5, 40 , 18);
    doc.text(90, 20, "Report");
    doc.setFontSize(10);
    doc.text(15, 40, "Below are the metric details : ");

    doc.autoTable(columns, rows, {startY: 85}); 
    doc.addPage();
    doc.internal.scaleFactor = 1.8;
    var width = doc.internal.pageSize.width;   

    var canvas = document.getElementById('graph');
    var canvasImg = canvas.toDataURL();

    doc.addImage(canvasImg, 'PNG', 5, 20, width-20, 70);
    doc.save('FFTcanvas.pdf');
}

---

谢谢。

您是否尝试过将引用传递给

-元素而不是base64编码的字符串？根据文件，这是可能的：我解决了。我将canvasImg代码放在addImage语法的正上方。

var canvas = document.getElementById('graph');
var canvasImg = canvas.toDataURL();
doc.addImage(canvasImg, 'PNG', 5, 20, width-20, 70);