Hi - I am stuck on passing data from php to google charts using the
google.visualization.dashboard classes . My code works fine end-to-end for
calling charts directly, but not when I use the dashboard classes. I am
near positive that there is something wrong with my JSON data, but I cannot
figure it out and again it works with calling the charts directly.
Here's the array that is return from variable $jsonTable:
{"cols":[{"label":"NZ
Crime","type":"string"},{"label":"Value","type":"number"}],"rows":[{"c":[{"v":"
Acts intended to cause injury"},{"v":"97"}]},{"c":[{"v":" Sexual assault
and related offences"},{"v":"44515"}]},{"c":[{"v":" Dangerous or negligent
acts endangering persons"},{"v":"3016"}]},{"c":[{"v":" Abduction,
harassment and other related offences against a
person"},{"v":"859"}]},{"c":[{"v":" Robbery, extortion and related
offences"},{"v":"14157"}]},{"c":[{"v":" Unlawful entry with
intent\/burglary, break and enter"},{"v":"2641"}]},{"c":[{"v":" Theft and
related offences"},{"v":"59323"}]},{"c":[{"v":" Fraud, deception and
related offences"},{"v":"136932"}]},{"c":[{"v":" Illicit drug
offences"},{"v":"9726"}]},{"c":[{"v":" Prohibited and regulated weapons and
explosives offences"},{"v":"22994"}]},{"c":[{"v":" Property damage and
environmental pollution"},{"v":"7074"}]},{"c":[{"v":" Public order
offences"},{"v":"58483"}]},{"c":[{"v":" Offences against justice
procedures, government security and government
operations"},{"v":"46105"}]},{"c":[{"v":" Miscellaneous
offences"},{"v":"19084"}]}]}
PHP code "loadpiechart.php":
<?php
require_once 'global.inc.php';
require_once 'classes/DB.class.php';
//create connection to the database
$connect = mysqli_connect('localhost', 'uname', 'pword', 'db');
if (mysqli_connect_errno($connect))
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
//get the $year breakout variable
$year = $_SESSION['Yearbreakout'];
$res = mysqli_query($connect, "SELECT * FROM `nzcrime2` WHERE Year =
$year");
$table['cols'] = array(
// Labels for your chart, these represent the column titles
// id is optional
//
array('label' => 'NZ Crime', 'type' => 'string'),
array('label' => 'Value', 'type' => 'number'),
);
$rows=array();
while($r=mysqli_fetch_assoc($res)){
$temp=array();
$temp[]=array('v'=> $r['Offence']);
$temp[]=array('v' => $r['Total']);
$rows[]=array('c' => $temp);
}
$table['rows'] = $rows;
$jsonTable = json_encode($table);
echo $jsonTable;
?>
And lastly the HTML code:
<html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript"
src="https://www.gstatic.com/charts/loader.js";></script>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.charts.load('current', {packages:['corechart', 'table',
'controls']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawTable);
function drawTable() {
var jsonData = $.ajax({
url: "loadpiechart.php",
dataType:"json",
async: false
}).responseText;
// Create our data table out of JSON data loaded from server.
var data = new google.visualization.DataTable(jsonData);
var table = new google.visualization.ChartWrapper({
'chartType': 'Table',
'containerId': 'table_div',
});
var chart = new google.visualization.ChartWrapper({
'chartType': 'PieChart',
'containerId': 'chart_div',
'view': {'columns': [0, 1]},
});
var control = new google.visualization.ControlWrapper({
'controlType': 'CategoryFilter',
'containerId': 'control_div',
'options': {
'filterColumnIndex': 0,
}
});
var dashboard = new google.visualization.Dashboard(
document.getElementById('dashboard_div'));
dashboard.bind([control], [table,chart]);
dashboard.draw(data);
}
</script>
</head>
<body>
<div id="dashboard_div" style="border: 1px solid #ccc; margin-top: 1em">
<p style="padding-left: 1em"><strong>Donuts eaten per person</strong></p>
<table class="columns">
<tr>
<td>
<div id="control_div" style="padding-left: 15px"></div>
</td>
</tr><tr>
<td>
<div id="chart_div" style="padding-top: 15px"></div>
</td><td>
<div id="table_div" style="padding-top: 30px"></div>
</td>
</tr>
</table>
</div>
</body>
</html>
--
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 view this discussion on the web visit
https://groups.google.com/d/msgid/google-visualization-api/6ba35e19-897d-4117-9500-21f725112531o%40googlegroups.com.
