Highcharts multiple data series

Question

I have a few array's of data that I'd like to add to high chart series. When adding the second or third array getting an error or setData undefined. The first series is drawing correctly.

            $('#container').highcharts({
            chart: {},
            series: [{
                data:[]
            }]
        });



        function showChart() {

        var series1 = [1, 52, 5, 98, 5, 929, 1, 9, 48];
        var series2 = [1, 92, 35, 8, 25, 729, 61, 29, 38];
        var series3 = [1, 59, 75, 26, 25, 829, 11, 19, 48];

        var mySeries = [];

        var chart = $('#container').highcharts();

        chart.series[0].setData(series1);
        chart.series[1].setData(series2);
        chart.series[2].setData(series3);
        chart.redraw();

    }//end show chart

Answer 1

You are initally creating a chart with a single blank series here:

series: [{
    data:[]
}]

chart.series[1] (a second series) and chart.series[2] (a third series) are therefore undefined.

A quick fix to your code could be:

var chart = $('#container').highcharts();
var series1 = [1, 52, 5, 98, 5, 929, 1, 9, 48];
var series2 = [1, 92, 35, 8, 25, 729, 61, 29, 38];
var series3 = [1, 59, 75, 26, 25, 829, 11, 19, 48];

chart.series[0].setData(series1, false); // setData on existing series, don't redraw
chart.addSeries({data: series2}, false); // add new series, don't redraw
chart.addSeries({data: series3}, true); // add new series, now redraw

Not the boolean arguments to the above methods will control the redraw.

Example here .