Google.visualization dashboard JSON data issue from php

38 views

Skip to first unread message

Bennznznz

unread,

Jun 9, 2020, 1:03:38 AM6/9/20

to Google Visualization API

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 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>

<p style="padding-left: 1em"><strong>Donuts eaten per person</strong></p>

<tr>

<td>

</td>

</tr><tr>

<td>

</td><td>

</td>

</tr>

</table>

</div>

</body>

</html>

Reply all

Reply to author

Forward

0 new messages