javascript 导出图表从html到pdf

tv6aics1 于 2022-12-25 发布在 Java

关注(0)|答案(1)|浏览(178)

这是我的图enter image description here
这个javascript

导出为pdf的功能

function generatePDF() {
    var pdf = new jsPDF();
    var elementHTML = document.getElementById("line_top_x").innerHTML;
    var specialElementHandlers = {
        '#elementH': function (element, renderer) {
            return true;
        }
    };
    pdf.fromHTML(elementHTML, 15, 15, {
        'width': 170,
        'elementHandlers': specialElementHandlers
    });
    pdf.save('line_top_x.pdf');
}

这个HTML id是line_top_x，并且具有generatepdf（）. function的onclick操作

<div>
    <div id="line_top_x"></div>
    <button onclick="generatePDF()">Export to PDF</button>
</div>

这个结果enter image description here
它只导出文本，但不显示图形
我想导出所有详细信息到pdf

JavaScript

来源：https://stackoverflow.com/questions/74906573/export-graph-from-html-to-pdf

1条答案

按热度按时间

zd287kbt1#

这个代码我的图表

google.charts.load('current', { 'packages': ['line'] });
google.charts.setOnLoadCallback(drawChart);

function drawChart() {

    var data = new google.visualization.DataTable();
        data.addColumn('number', 'Day');
        data.addColumn('number', 'Guardians of the Galaxy');
        data.addColumn('number', 'The Avengers');
        data.addColumn('number', 'Transformers: Age of Extinction');

        data.addRows([
            [1, 37.8, 80.8, 41.8],
            [2, 30.9, 69.5, 32.4],
            [3, 25.4, 57, 25.7],
            [4, 11.7, 18.8, 10.5],
            [5, 11.9, 17.6, 10.4],
            [6, 8.8, 13.6, 7.7],
            [7, 7.6, 12.3, 9.6],
            [8, 12.3, 29.2, 10.6],
            [9, 16.9, 42.9, 14.8],
            [10, 12.8, 30.9, 11.6],
            [11, 5.3, 7.9, 4.7],
            [12, 6.6, 8.4, 5.2],
            [13, 4.8, 6.3, 3.6],
            [14, 4.2, 6.2, 3.4]
        ]);

    var options = {
            chart: {
                title: 'Box Office Earnings in First Two Weeks of Opening',
                subtitle: 'in millions of dollars (USD)'
            },
            width: 900,
            height: 500,
            axes: {
                x: {
                    0: { side: 'top' }
                }
            }
    };

    var chart = new google.charts.Line(document.getElementById('line_top_x'));
        chart.draw(data, google.charts.Line.convertOptions(options));
}

赞(0）回复(0）举报 2022-12-25

我来回答

javascript 导出图表从html到pdf

1条答案

相关问题

热门标签

最新问答