How to parse JSON into HighCharts line graph?

highcharts, javascript, jquery, json

Solution

As far as I can tell your `data` seems to be well formed. So, this should do it:

var chart;
$.getJSON('http://localhost:8080/UDPver/tagdiscover', function(data) {
  // Populate series
  options.series = data;    
  // Create the chart
  chart = new Highcharts.Chart(options);
});

Problem

I am trying to parse the following JSON string remotely: ``` [{"name":"Object1","data":[1,2]},{"name":"Object2","data":[3,4]}] ``` I am doing so with the following code: ``` $(function () { var chart; $(document).ready(function() { var options = { chart: { renderTo: 'container', type: 'line', marginRight: 130, marginBottom: 25 }, title: { text: 'hits by time', x: -20 //center }, subtitle: { text: 'Source:', x: -20 }, xAxis: { categories: ['8am', '9am', '10am', '11am', '12pm', '1pm', '2pm', '3pm', '4pm', '5pm', '6pm', '7pm'] }, yAxis: { title: { text: 'Hits' }, plotLines: [{ value: 0, width: 1, color: '#808080' }] }, tooltip: { formatter: function() { return '<b>'+ this.series.name +'</b><br/>'+ this.x +': '+ this.y; } }, legend: { layout: 'vertical', align: 'right', verticalAlign: 'top', x: -10, y: 100, borderWidth: 0 }, series: [] }; $.getJSON('http://localhost:8080/jsonget', function(data) { var series = { data: [] }; $.each(data, function(i,item){ alert(item.name); series.name = item.name; $.each(item.data, function(j,dataitem){ alert(dataitem); series.data.push(parseFloat(dataitem[i])); }); }); options.series.push(series); // Create the chart var chart = new Highcharts.Chart(options); }); }); }); ``` The chart does not render, but does so when I substitute the remote portion for the CSV example on the site. Does anyone know what the problem is?

Original source