Search code examples
javascriptjqueryasp.net-mvcjsonphighcharts

Incorrect JSON data format

I am trying to create some JSON to be used for displaying a chart using Highcharts

http://www.highcharts.com/

I have copied one of their examples:

http://www.highcharts.com/stock/demo/basic-line

Click "View Options" under the graph to see the source. There is also a JSFiddle there to play with

If I copy that locally it all works fine.

The problem is when I try to use my own data source.

I have an ASP.Net MVC controler which is spitting out a list of arrays, just like their data source. However, that doesn't work.

Their datasource looks like this http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?

and they retrieve it like this

$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) {

So I thought I'd take a step back and copy thier data exactly and put it in a text file on my server and try that:

So I tried this

$.getJSON('/data.txt', function (data) {

and this

$.get('/data.txt', function (data) {

but neither work

I have also tried using both JSON.parse and jQuery.parseJSON after retrieving the data, but again - that doesn't seem to work

I am also wondering what the ? is at the start of their data

Their data looks like this

?([[<some data>],[some data]]);

I don't get any error message, the graph just doesn't display

any ideas?

SOLVED IT

Just need to retrive the data and turn it into an array and pass it to the chart.

Needs to be an array, not JSON

Solution

  • That datasource is ouputting JSONP, which is for cross-domain AJAX requests. It's not valid 'raw' JSON because of that extra callback(...) wrapper.

    Read up about it here: http://api.jquery.com/jQuery.ajax/ under the 'dataType' section.