Javascript 重新加载包含json数据小节的高位图表

我是javascript新手，需要一些帮助，当用户单击下拉菜单时，让我的highchart重新加载

以下是我所拥有的：

Javascript:

$(function() {
    $.getJSON('cgi-bin/fakedata.js', function(main) {


    var chart1 = new Highcharts.Chart({
        chart : { 
             backgroundColor: 'black',
             renderTo: 'chart1'
        },
        title: {
            text: 'DI Status Report',
            x: -20 //center
        },
        xAxis: {
            categories: getDates(main)
        },
        yAxis: {
            min: 0,
            max: 100,
            title: {
                text: 'Completion'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        tooltip: {
            backgroundColor: '#282828',
            valueSuffix: '%'
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 0
        },
        series: [{
            name: 'Reel 1',
            data: [5,30,50]
        }, {
            name: 'Reel 2',
            data: [10,20,30]
        }, {
            name: 'Reel 3',
            data: [40,60,100]
        }, {
            name: 'Reel 4',
            data: [40,50,55]
        }]
    });
    });
});

HTML:

---

如何使用ajax向chart1发送附加数据并更新页面？

您可以使用以下命令更新图表数据：

function updateData() {
    // get the data via ajax
    var data1, data2, data3, data4;

    var chart = $('#chart1').highcharts();
    chart.series[0].setData(data1);
    chart.series[1].setData(data2);
    chart.series[2].setData(data3);
    chart.series[3].setData(data4);
}

---

谢谢如果我想更新整个图表，有没有像.setData这样的更新函数？你是什么意思？一次重画整个图表？如文档中所述，您可以将false作为第二个参数传递给setData，然后在更新所有数据后调用chart.redraw。

<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
    <li><a style="color: grey" onClick="updateData()" data-value="2015-10-08">2015-10-08</a></li>
    <li><a style="color: grey" onClick="updateData()" data-value="2015-10-01">2015-10-01</a></li>
    <li><a style="color: grey" onClick="updateData()" data-value="2015-09-28">2015-09-28</a></li>

function updateData() {

...

function updateData() {
    // get the data via ajax
    var data1, data2, data3, data4;

    var chart = $('#chart1').highcharts();
    chart.series[0].setData(data1);
    chart.series[1].setData(data2);
    chart.series[2].setData(data3);
    chart.series[3].setData(data4);
}