Google 可视化导出 DataView 到 Excel

Question

我正在寻求有关为用户提供单击按钮以将 chart/table 后面的 DataView 导出到 Excel 的最佳实践的建议。

我查看了 Toolbar 功能，但发现它不起作用，因为 DataView 是“手动填充”的，而不是 API 所需的 URL . （理解有误请指正）

我更喜欢 follow/use 领域中常见的方法。

建议？

Answer 1

这就是我为任何感兴趣的人解决的方法。

HTML:

<div id="div_table"></div>
<a id="exportCSV" href="">Excel</a>

我的 table 对象是 .ChartWrapper 所以我可以稍后使用 .getDataTable() 方法。

var table = new google.visualization.ChartWrapper({
    chartType: 'Table',
    containerId: 'div_table',
    options: {allowHtml: true}
});

JavaScript - Google 可视化事件侦听器

document.getElementById("exportCSV").addEventListener("click", function () {
    var csvData = table.getDataTable(); //google visualization DataTable to download
    export_CSV("exportCSV", csvData);
});

Javascript - 函数来源 material

function export_CSV(elementID, data) {

    var csvColumns;
    var csvContent;
    var downloadLink;

    // build column headings
    csvColumns = '';
    for (var i = 0; i < data.getNumberOfColumns(); i++) {
        csvColumns += data.getColumnLabel(i);
        if (i < data.getNumberOfColumns() - 1) {
            csvColumns += ',';
        }
    }
    csvColumns += '\n';

    // get data rows
    csvContent = csvColumns + google.visualization.dataTableToCsv(data);

    //New Download Link - works in chrome and mozilla
    downloadLink = document.getElementById(elementID);
    downloadLink.href = 'data:text/csv;charset=utf-8,' + encodeURI(csvContent);
    downloadLink.download = 'data.csv';
    downloadLink.target = '_blank';
}

这对我的应用程序来说工作正常。干杯！

Google 可视化导出 DataView 到 Excel

Google visualization export DataView to Excel

javascript

json

google-visualization

export-to-excel