如何在数据更改highcharts上更新数据表

Question

我有一个饼图，我正在使用下面的代码点击按钮动态更新。

单击按钮

   $("#myChart").highcharts().series[0].setData($.extend(true, [], data1)) 

我正在使用密钥来填充数据表。

 keys: ['Count','Value'],

这工作正常并更新图表，但我也在导出菜单中启用了导出数据表，但该数据表不更新。所有连续按钮点击都保持不变。

如何通过单击按钮更新数据表以显示新数据的数据。

这是一个小提琴，但它并没有真正使用按钮，只是为了让你了解我的图表：https://jsfiddle.net/mewohraz/1/

更新：下面的解决方案有效，但我必须注释掉我正用于切换viewData表的这段代码。如果再次单击viewData，它允许我关闭表。如何使用chart.viewData（）进行操作？

Highcharts.Chart.prototype.viewData = function () {
    if (!this.insertedTable) {
        var div = document.createElement('div');
        div.className = 'highcharts-data-table';
        // Insert after the chart container
        this.renderTo.parentNode.insertBefore(div, this.renderTo.nextSibling);
        div.innerHTML = this.getTable();
        this.insertedTable = true;
        div.id = this.container.id + '-data-table';
    }
    else {
        $('#' + this.container.id + '-data-table').toggle();
    }
};

Answer 1

您需要调用viewData内部方法来刷新数据表：

$('#update').on('click', function() {
    var data1 = [...];

    chart.series[0].setData(data1);
    chart.viewData();
});

现场演示：https://jsfiddle.net/BlackLabel/ahowu9tm/