The JSON string works for me: http://jsfiddle.net/asgallant/p64fm/
There is probably a problem with your AJAX call. Call console.log(jsonData)and
check the contents of the developer's console in Chrome or Firefox to
see what jsonData contains.
On Tuesday, April 15, 2014 7:13:11 PM UTC-4, Vincent_IRE wrote:
>
> Hi,
>
> Tried that. Got the output you described. getdata2.php output now.
>
> { "cols": [{"label": "name","type": "string"},{"label": "up","type":
> "number"}],"rows" : [{"c":[{"v": "Google"},{"v": 1}]},{"c":[{"v":
> "mercury"},{"v": 2}]}]}
>
> Code playground still says that the "table has no columns"?
>
> Any ideas?
>
> This is my getdata2.php
>
> <?php
> mysql_connect('localhost','root','*******') or die("Cannot connect to
> host");
> mysql_select_db('DBname');
> $query="select name,up from sites";
> $result=mysql_query($query);
> $resultJsonString=MakeJSONFormatForChart($result);
> echo $resultJsonString;
> ?>
> <?php
> function MakeJSONFormatForChart($results){
> $resultString = "";
> $resultString = MakeColumnsBlock($results,$resultString);
> $resultString = $resultString . '"rows" : [';
> $rows=array();
> while($r=mysql_fetch_array($results)){
> $rows[]='{"c":[{"v": "'.$r['name'].'"},{"v":
> '.$r['up'].'}]}';
> }
> $resultString = $resultString . implode(',', $rows)."]}";
> return $resultString;
> }
> function MakeColumnsBlock($results,$resultString){
> $resultString = '{ "cols": [{"label": "name","type":
> "string"},{"label": "up","type": "number"}],';
> return $resultString;
> }
> ?>
>
> This is my chart.html
> <html>
> <head>
> <!--Load the AJAX API-->
> <script type="text/javascript" src="https://www.google.com/jsapi";></
> script>
> <script type="text/javascript" src="//
> ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
> <script type="text/javascript">
> // Load the Visualization API and the piechart package.
> google.load('visualization', '1', {'packages':['corechart']});
> // Set a callback to run when the Google Visualization API is loaded.
> google.setOnLoadCallback(drawChart);
> function drawChart() {
> var jsonData = $.ajax({
> url: "localhost/servermonitor/getdata2.php",
> dataType:"json",
> async: false
> }).responseText;
> // Create our data table out of JSON data loaded from server.
> var data = new google.visualization.DataTable(jsonData);
> // Instantiate and draw our chart, passing in some options.
> var chart = new google.visualization.PieChart(document.
> getElementById('chart_div'));
> chart.draw(data, {width: 400, height: 240});
> }
> </script>
> </head>
>
> <body>
> <!--Div that will hold the pie chart-->
> <div id="chart_div"></div>
> </body>
> </html>
>
>
>
>
>
>
> On Tuesday, 15 April 2014 15:47:05 UTC+1, Andrew Gallant wrote:
>>
>> Your ow structure is wrong, each row should be an object with a "c"
>> property which is an array of cells. Your cells are almost correct (the
>> numbers should not be quoted), but you need to put them in the cell arrays
>> correctly. Instead of this:
>>
>> {"c":[{"v": "Google"},]},{"c":[{"v": "1"},]} // highlighted the stuff to
>> remove in red
>>
>> you should have this:
>>
>> {"c":[{"v": "Google"},{"v": 1}]}
>>
>> On Tuesday, April 15, 2014 6:45:39 AM UTC-4, Vincent_IRE wrote:
>>
>> Hi asgallant, I've been trying to get this chart working for a couple of
>> days.
>>
>> This is the result of my getdata2.php
>>
>> { "cols": [{"label": "name","type": "string"},{"label": "up","type":
>> "number"}],"rows" : [{"c":[{"v": "Google"},]},{"c":[{"v":
>> "1"},]},{"c":[{"v": "mercury"},]},{"c":[{"v": "2"},]}]}
>>
>> When I run chart.html on goolge code playground, the output says "table
>> has no colums". See chart.html below. Any help would be greatly
>> appreciated.
>>
>> <html>
>> <head>
>> <!--Load the AJAX API-->
>> <script type="text/javascript" src="https://www.google.com/jsapi";></
>> script>
>> <script type="text/javascript" src="//
>> ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
>> <script type="text/javascript">
>>
>> // Load the Visualization API and the piechart package.
>> google.load('visualization', '1', {'packages':['corechart']});
>>
>> // Set a callback to run when the Google Visualization API is loaded.
>> google.setOnLoadCallback(drawChart);
>>
>> function drawChart() {
>> var jsonData = $.ajax({
>> url: <span style="color:rgb(0,136,0);font-family:
>>
>> ...
>
>
--
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.
For more options, visit https://groups.google.com/d/optout.
