Google Chart API implementation displaying blank page
Question
Attempting to implement a form to insert simple data into a database, then have a google chart display based on the database. Page is currently blank. (I'll worry about the form when the chart displays properly).
I've checked around google for some answers, but the code is basically straight from their tutorial on google charts with a few modifications.
<?php
require_once("apicreds.php");
$db = new PDO($connectionString, $username , $password);
if(!$db){echo "Connection Error";}
if($db){echo "Connected!";}
$query = "SELECT `country`, `sum(visits)` FROM `trips` GROUP BY
`country`";
$result = $db->query($query);
?>
<html>
<head>
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.arrayToDataTable([
['country', 'visits'],
<?php
while($row=$result->fetch_assoc())
{
echo "['".$row['country']."',".$row['sum(visits)']."],";
}
?>
]);
var options = {'title':'Visits To Countries',
'is3D':true};
var chart = new
google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="chart_div"></div>
</body>
</html>
Some of these tags might be messed up, so the full code is here.
copy of the current table:
country visits
Germany 1
Canada 2
UK 1
UK 1
Ideally, it should output in a 3d pie chart from the table, and update as more data is inserted. That part, I should be able to handle later, but I need help finding out why it won't display at the moment.
1 answers
solution1
0 ACCPTED 2019-04-11 11:37:17
need to name the sum column using the as keyword,
the result will not have a valid key for --> sum(visits)
$query = "SELECT country, sum(visits) as total_visits FROM trips GROUP BY country";
then when loading the data, access the named column...
echo "['".$row['country']."',".$row['total_visits']."],";
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.