如何使用csv文件中的数据更新选择更改的highcharts.js图表​​？

Question

我正在使用highcharts.js，并且最终会有许多图表需要根据所选的选择值进行更改。所有不同的图表都将从最终产品中的csv文件中读取。

以下是一个示例小提琴：https://jsfiddle.net/o0d3mpnb/1/

这是我在最终项目中使用的代码，用于从csv中获取：

$(function() {
    Highcharts.setOptions({
        lang: {
            decimalPoint: '.',
            thousandsSep: ','
        }
    });

    $.get('/procurement/reports/voucher-total-dollar.csv', function(csv) {
        $('#donut-1').highcharts({
            credits: {
                enabled: false
            },
            chart: {
                type: 'column',
                height: 300
            },
            title: {
                text: 'VOUCHERS TOTAL $ AMOUNT',        
                xAxis: {
                categories: [
                    'Totals'                            
                ],
                crosshair: true
            },
            yAxis: {                
                title: {
                    text: 'Total'
                }
            },
            legend: {
                enabled: true
            },
            tooltip: {              
                pointFormat: 'Total: <b>${point.y}</b>'
            },
            data: {
                csv: csv,               
                firstRowAsNames: true
            }
        });
    });
});

我已经找到了如何更新数据并重新绘制图表，具体取决于所选内容的值。我没想到的是如果选择“全部”选项，如何返回原始数据集。

为了共享，代码从文档中的id中提取原始的“csv数据”，但最终需要是外部文件，如上面的代码所示。

所以我的问题是双重的：

1. 如果选择“all”选项，我如何恢复原始csv文件中的数据？以及

2. 如何从不同的csv文件加载更新的数据，而不是从当前在jquery中的数据数组加载？

我对jquery很新，并且在这个项目之前从未使用过highcharts，而且直到现在我一直在绊倒这一切。任何帮助将不胜感激。谢谢！

Answer 1

响应1：您需要在$(...).change中添加其他条件：

else if (travelOption == 'all') { 
  chart.series[0].setData([ /* insert data here */ ]); 
  chart.redraw(); 
} 

我这样做是通过创建一个更新图表数据的函数，然后调用它来获取数据。

function updateSeries(data) { 
    ... 
} 

switch (travelOption) { 
    case 'all': 
        updateSeries(add(series1, series2))
        break 
    ... 
} 

响应2：假设您正在进行Web开发，您需要从服务器发出AJAX请求，例如：How to read data From *.CSV file using javascript?