php chart not showing all fields
Question
I am using google charts (on a php webpage) with data from an sql DB. The problem i am having is that it is not display the field names and values properly it simply displays the value of the first field "expense". It should be showing two fields "expense" and "income" with the values in the db. Any ideas what i am doing wrong ?
my code below:
<?php
$dbhandle = new mysqli('localhost','root','','useraccounts');
echo $dbhandle->connect_error;
$query = "SELECT * FROM ctincome";
$res = $dbhandle->query($query);
?>
<html>
<head>
<script type="text/javascript"
src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load("current", {packages:["corechart"]});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['expense','income'],
<?php
while($row=$res->fetch_assoc())
{
echo "['".$row['expense']."','".$row['income']."'],";
}
?>
]);
var options = {
title: 'Expenses to Income',
pieHole: 0.4,
};
var chart = new
google.visualization.PieChart(document.getElementById
('donutchart'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="donutchart" style="width: 900px; height: 500px;"></div>
</body>
</html>
2 answers
solution1
0 2019-04-08 11:33:52
the values for the income column should be numbers, not strings.
remove the single quotes from the second column.
from...
echo "['".$row['expense']."','".$row['income']."'],";
to...
echo "['".$row['expense']."',".$row['income']."],";
solution2
0 2019-04-08 12:07:22
I have three suggestions based on my experience in crossbrowser or javascript bugs I solved.
First point : You are just echoing , you need to use concatenation .
<?php
$data = '';
while($row=$res->fetch_assoc())
{
$data .= "['".$row['expense']."','".$row['income']."'],";
}
?>
var data = google.visualization.arrayToDataTable([
['expense','income'],
<?php echo $data; ?>
]);
second point : In javascript last comma may or may not work, its best to not to append comma if it's a last row.
var data = google.visualization.arrayToDataTable([
['expense','income'],
<?php
while($row=$res->fetch_assoc())
{
if(last row )
$data .= "['".$row['expense']."','".$row['income']."']";
else $data .= "['".$row['expense']."','".$row['income']."'],";
}
?>
]);
third suggestion : check data type of var data before and after the concatenation
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.