如何将多个数据系列放入 Highcharts答案

【问题标题】：How to get multiple data series into Highcharts如何将多个数据系列放入 Highcharts
【发布时间】：2013-04-19 16:53:27
【问题描述】：

以下代码有效：

var options1 = {
    chart: {
        renderTo: 'container1'
    },
    series: [{}]
    };

$.getJSON('tokyo.jsn', function(data){
        options1.series[0].data = data;
        var chart = new Highcharts.Chart(options1);
    });

我希望能够添加一些数据系列，所以我试图从 getJSON 中提取对“新 Highcharts”的引用，但我似乎没有正确理解。以下代码不起作用：

$.getJSON('tokyo.jsn', function(data){
    options1.series[0].data = data;
});
var chart = new Highcharts.Chart(options1);

我也尝试过以不同的方式解决它，但以下代码再次不起作用：

var chart1 = new Highcharts.Chart({
    chart: {
        renderTo: 'container1'
    },
    series: [{}]
});

$.getJSON('tokyo.jsn', function(data){
    chart1.series[0].data = data;
});

谁能指出我正确的方向。我需要能够通过执行第二个 getJSON 调用来支持多个数据系列，如下所示：

$.getJSON('sydney.jsn', function(data){
    options1.series[1].data = data;
});

我使用的 JSON 代码如下：

[ 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6 ]

谢谢

【问题讨论】：

标签： json highcharts

【解决方案1】：

$.getJSON 是一个异步请求。收到数据后，您可以将其传递给 Highcharts，因此您必须从 $.getJSON() 的回调函数中调用该代码。

试试这个，使用辅助函数来处理你的数据并绘制图表，见下面的drawChart()：

var options1 = {
    chart: {
        renderTo: 'container1'
    },
    series: []
};

var drawChart = function(data, name) {
    // 'series' is an array of objects with keys: 
    //     - 'name' (string)
    //     - 'data' (array)
    var newSeriesData = {
        name: name,
        data: data
    };

    // Add the new data to the series array
    options1.series.push(newSeriesData);

    // If you want to remove old series data, you can do that here too

    // Render the chart
    var chart = new Highcharts.Chart(options1);
};

$.getJSON('tokyo.jsn', function(data){
    drawChart(data, 'Tokyo');
});
$.getJSON('sydney.jsn', function(data){
    drawChart(data, 'Sydney');
});

见小提琴：http://jsfiddle.net/amyamy86/pUM7s/

【讨论】：

您需要先删除以前的图表，然后再在同一容器中创建新图表。此外，您可以简单地使用addSeries() 方法。
你好甜淀粉酶。我不知道如何与您联系，如果这不合适，我很抱歉！我有一个问题：stackoverflow.com/questions/35802637/… 我不知道如何解决它。你似乎很擅长你的工作，我想知道你是否能够帮助我？谢谢！

【解决方案2】：

您可以在该示例中使用 Highcharts 使用的解决方案：http://www.highcharts.com/stock/demo/compare

或者先创建一个空图表，没有任何系列，然后在每个回调中使用addSeries()函数，见：http://api.highcharts.com/highcharts#Chart.addSeries()

【讨论】：