Parsing json data to highcharts

Question

I have searched and searched but i'm unable to find the solution yet.

I'm trying to load data into Highcharts with json from my server. This is the json returned from my server:

   [{
    "x": "\/Date(1352674800000)\/",
        "y": 621
}, {
    "x": "\/Date(1352761200000)\/",
        "y": 646
}, {
    "x": "\/Date(1352847600000)\/",
        "y": 690
}, {
    "x": "\/Date(1352934000000)\/",
        "y": 688
}, {
    "x": "\/Date(1353020400000)\/",
        "y": 499
}]

this is my highchart: (from my jsfiddle)

    var seriesData = [];
for (var i = 0; i < data.length; i++) {
   var dateString = data[i].x;
var x = dateString.replace(/\/Date\((\d+)\)\//, '$1');


    var y = data[i].y;


    seriesData.push([x, y]);

}
alert(seriesData);

var options = {
    chart: {
        renderTo: 'container'
    },
    xAxis: {        
        type: 'datetime',
        labels: {
            formatter: function() {
            var monthStr = Highcharts.dateFormat('%a', this.value);
            var firstLetter = monthStr.substring(0, 1);
            return firstLetter;
            }
        }
    },



    series: []
};

function myfunk() {
   options.series.push(seriesData);



    chart = new Highcharts.Chart(options);
}
myfunk();

but my data is not showing.

i made a jsfiddel: http://jsfiddle.net/grVFk/12105/

Edit:

Now it's working but is the data point showing the wrong dates? http://jsfiddle.net/dxCHB/18/

If someone could help me i would be very grateful ! :)

SteveP · Accepted Answer · 2013-03-10 12:23:30Z

2

You were very close. The series array needs to contain an object with a data member:

 series: [
    {
       data:[]
    }
 ]

You can then set it using:

function myfunk() {
    options.series[0].data = seriesData;

I modified your jsfiddle: http://jsfiddle.net/dxCHB/

Format your date numerically

seriesData.push([x/1, y]);

edited Mar 10, 2013 at 12:23

answered Mar 9, 2013 at 13:33

SteveP

19.2k9 gold badges49 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

SteveP Over a year ago

Lol. I've seen you around on the highcharts questions. You've posted some good answers.

MatthewKremer Over a year ago

Thanks @SteveP. I use HighCharts every day at my job, decided I should probably start helping people on here if I can. I'm definitely not a master, but I try.

Mikkel Gunvald Over a year ago

Thx SteveP! But how do i get it to display date/weekday on the x axis? Why is this not working? jsfiddle.net/dxCHB/10

SteveP Over a year ago

Your date data needs to numerical, not a string. X/1 forces it to be a number.

Sebastian Bochan · Accepted Answer · 2013-03-12 12:15:05Z

0

Your data should be number, so you can use parseFloat() function to transform string to number.

answered Mar 12, 2013 at 12:15

Sebastian Bochan

37.6k3 gold badges51 silver badges75 bronze badges

Collectives™ on Stack Overflow

Parsing json data to highcharts

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related