Hi, Don't exactly know what did the trick, but I - added a 'Content-Type: application/json' to my php-script - added the 'type: POST' to the ajax-request - moved the function definition up before the invocation of 'setOnLoadCallback' and now it looks as good as your jsfiddle example.
Thanks for your help! Den lørdag den 1. juni 2013 09.27.43 UTC+2 skrev asgallant: > > I built a test case based on your JSON on jsfiddle (using jsfiddle's AJAX > emulation), and it works for me: http://jsfiddle.net/asgallant/s2z9Y/. > Try using this version on your page: > http://jsfiddle.net/asgallant/s2z9Y/1/ > > On Saturday, June 1, 2013 1:38:51 AM UTC-4, Galten FS Gymnastik wrote: >> >> Hi. >> Thanks for the quick reply. >> The console shows: >> >> {"cols": [{"label":"Time", "type":"date"},{"label":"Dataseries 0", >> "type":"number"},{"label":"Dataseries 1", "type":"number"}], "rows": >> [{"c":[{"v":"Date(2013,05,29,06,29,00)", "f":"2013-05-29 06:29:00"}, >> {"v":186,"f":"Value=186"},{"v":null, "f":null}]}, >> {"c":[{"v":"Date(2013,05,29,06,29,00)", "f":"2013-05-29 06:29:00"}, >> {"v":null, "f":null},{"v":91,"f":"Value=91"}]}, >> {"c":[{"v":"Date(2013,05,29,06,32,00)", "f":"2013-05-29 06:32:00"}, >> {"v":190,"f":"Value=190"},{"v":null, "f":null}]}, >> {"c":[{"v":"Date(2013,05,29,06,32,00)", "f":"2013-05-29 06:32:00"}, >> {"v":null, "f":null},{"v":101,"f":"Value=101"}]}]} >> >> Den fredag den 31. maj 2013 15.58.36 UTC+2 skrev asgallant: >>> >>> Replace the alert(jsonData); with console.log(jsonData); open the page >>> in Chrome and view the developer's console (ctrl+shift+j to open). Post >>> whatever is printed there here. >>> >>> On Friday, May 31, 2013 2:17:20 AM UTC-4, Galten FS Gymnastik wrote: >>>> >>>> Hi, >>>> I am playing around with a simple line-chart that I cannot make work >>>> correctly when fetching a json-string from my server. >>>> When I put the string returned by the server in-line in the html-page, >>>> everything is fine. >>>> I have tried all (I think) combinations of string-delimiters (none, ", >>>> and ') for the date-values but to no avail. >>>> >>>> The inline html looks like this: >>>> >>>>> <html> >>>>> >>>>> <head> >>>>> >>>>> <!--Load the AJAX API--> >>>>> >>>>> <script type="text/javascript" src=" >>>>>> https://www.google.com/jsapi";></script> >>>>> >>>>> <script type="text/javascript" src=" >>>>>> http://code.jquery.com/jquery-1.10.1.min.js";></script> >>>>> >>>>> <script type="text/javascript"> >>>>> >>>>> google.load('visualization', '1', >>>>>> {'packages':['corechart', 'table']}); >>>>> >>>>> google.setOnLoadCallback(drawChart); >>>>> >>>>> >>>>> >>>>> function drawChart() { >>>>> >>>>> var jsonData = '{"cols": [{"label":"Time", >>>>>> "type":"date"},{"label":"Dataseries 0", >>>>>> "type":"number"},{"label":"Dataseries 1", "type":"number"}], "rows": >>>>>> [{"c":[{"v":"Date(2013,05,29,06,29,00)", "f":"2013-05-29 06:29:00"}, >>>>>> {"v":186,"f":"Value=186"},{"v":null, "f":null}]}, >>>>>> {"c":[{"v":"Date(2013,05,29,06,29,00)", "f":"2013-05-29 06:29:00"}, >>>>>> {"v":null, "f":null},{"v":91,"f":"Value=91"}]}, >>>>>> {"c":[{"v":"Date(2013,05,29,06,32,00)", "f":"2013-05-29 06:32:00"}, >>>>>> {"v":190,"f":"Value=190"},{"v":null, "f":null}]}, >>>>>> {"c":[{"v":"Date(2013,05,29,06,32,00)", "f":"2013-05-29 06:32:00"}, >>>>>> {"v":null, "f":null},{"v":101,"f":"Value=101"}]}]}'; >>>>> >>>>> >>>>>> var data = new >>>>>> google.visualization.DataTable(jsonData); >>>>> >>>>> var table = new >>>>>> google.visualization.Table(document.getElementById('table_div')); >>>>> >>>>> var chart = new >>>>>> google.visualization.LineChart(document.getElementById('chart_div')); >>>>> >>>>> table.draw(data, {width: 600, height: 400, >>>>>> showRowNumber: true}); >>>>> >>>>> chart.draw(data, {width: 600, height: 400, >>>>>> interpolateNulls:true}); >>>>> >>>>> } >>>>> >>>>> </script> >>>>> >>>>> </head> >>>>> >>>>> <body> >>>>> >>>>> <hr> >>>>> >>>>> <div id="chart_div"></div> >>>>> >>>>> <hr> >>>>> >>>>> <div id="table_div"></div> >>>>> >>>>> </body> >>>>> >>>>> </html> >>>>> >>>>> and generates this >>>> >>>> >>>> <https://lh5.googleusercontent.com/-EZOQQPBvjPY/Uag-gqIKNbI/AAAAAAAABy4/tZ-mNQtZUX0/s1600/jsonhtmlok.JPG> >>>> >>>> >>>> And the non-working html looks like this: >>>> >>>> <html> >>>> >>>> <head> >>>> >>>> <!--Load the AJAX API--> >>>> >>>> <script type="text/javascript" src="https://www.google.com/jsapi";> >>>> </script> >>>> >>>> <script type="text/javascript" src=" >>>> http://code.jquery.com/jquery-1.10.1.min.js";></script> >>>> >>>> <script type="text/javascript"> >>>> >>>> google.load('visualization', '1', {'packages':['corechart', 'table']}); >>>> >>>> google.setOnLoadCallback(drawChart); >>>> >>>> function drawChart() { >>>> >>>> var jsonData = $.ajax({url: "/index.php", data: {"get_data": >>>> "dataseries"}, dataType:"json", async: false}).responseText; >>>> >>>> alert(jsonData); >>>> >>>> var data = new google.visualization.DataTable(jsonData); >>>> >>>> var chart = new >>>> google.visualization.BarChart(document.getElementById('chart_div')); >>>> >>>> var table = new >>>> google.visualization.Table(document.getElementById('table_div')); >>>> >>>> chart.draw(data, {width: 600, height: 400, interpolateNulls:true}); >>>> >>>> table.draw(data, {width: 600, height: 400, showRowNumber: true}); >>>> >>>> } >>>> >>>> </script> >>>> >>>> </head> >>>> >>>> <body> >>>> >>>> <div id="chart_div"></div> >>>> >>>> <div id="table_div"></div> >>>> >>>> >>>> </body> >>>> >>>> </html> >>>> >>>> >>>> >>>> >>>> >>>> The string returned by the index.php?get_data=dataseries is the >>>> contents of the jsonData-variable from the html-example, and the result >>>> looks like: >>>> >>>> >>>> <https://lh5.googleusercontent.com/-XenXyA2iW0M/Uag_7aDby7I/AAAAAAAABzE/LjEhZz-YK1I/s1600/jsonserverfetchnotok.JPG> >>>> >>>> >>>> Why is this happening - and how do I make it behave identically? >>>> >>>> Thanks, >>>> A >>>> >>> -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-visualization-api?hl=en. For more options, visit https://groups.google.com/groups/opt_out.
