javascript - Google Chart - uncaught error: not an array

Question

I have a php script that generates the google chart data and returns it in json encoded format. It's loaded into google chart using jQuery $.get() method. When I pass the return data to the google "arrayToDataTable" function like this:

var googleChartData = google.visualization.arrayToDataTable(chartData);

I get this error:

So, what I did was I dumped the value of my variable "chartData" and I got the following:

So, what I did was, copy this data from console window into the "arrayToDataTable" function manually like this:

var googleChartData = google.visualization.arrayToDataTable([["Date Range","0001/102/0 Available","0001/102/0 Unavailable","0001/102/1 Available","0001/102/1 Unavailable"],["02/10/2013",0,1,110,11],["03/10/2013",0,1,189,11],["04/10/2013",0,1,189,11],["06/10/2013",0,1,189,10],["07/10/2013",0,1,187,10],["08/10/2013",186,11,0,1],["09/10/2013",186,11,0,1],["10/10/2013",0,1,186,11],["11/10/2013",0,1,204,11],["13/10/2013",0,1,204,11]]);

Now the chart renders (as expected, because the returned data from my php script is correct):

This is a bit bizarre; does any one know why the chart doesn't work when it's loaded from the variable?

Answer 1

I've solved it by changing arrayToDataTable line like this:

var googleChartData = google.visualization.arrayToDataTable($.parseJSON(chartData));

Thanks to this post: https://stackoverflow.com/a/9420583/2332336