Highcharts with AJAX graph generating

Question

Ive tried to implement AJAX into highcharts, but for some reason cannot get it working.

My HTML and javascript look like this:

function test () {
var options = {
    chart : {
        renderTo : 'container',
        type : 'spline',
        zoomType: 'x',
    },
    series : [{
            data: []
    }]
};

$.ajax({
        url : 'data.php?year=' + year,
        datatype : 'json',
        success : function () {
            options.series[0].setData(json['data']);
            chart = new Highcharts.Chart(options);
        },
    });
}

The data.php output is:

{"name":2012,"data":[-1.4,-1.4,-1.3,-1.3,-1.3,-1.3,-1.3,-1.2,-1.3,-1.2,-1.2,-1.2]}

Any ideas what is wrong?

---

I changed it to this: function test () { var options = { chart : { renderTo : 'container', type : 'spline', zoomType: 'x', }, series : [{ data: [], }] };

$.ajax({
    url : 'data.php?year=' + year,
    datatype : 'json',
    success : function (json) {
        options.series[0].data = json;
        chart = new Highcharts.Chart(options);
    },
});
}

but still I get no chart at all

Answer 1

You forgot the data parameter for your success function.

    success : function () {

should be

    success : function(json) {

Right now json is undefined within that function.

Answer 2

In case when you load series object by json, you need to parse it to json (it is string) or return json in script. Morever if you get series object, you cannot assign it to the data object, so in your case you need to use series: datajson