i am trying to display the latest speed in mysql database on guage chart. i have tried so many things but gauge is not display plz any can help me...my code is attached and php part shows the correct value but dont know why guage is not display
<?php
$host="localhost"; // Host name
$username="root"; // Mysql username
$password=""; // Mysql password
$db_name="mysql"; // Database name
$tbl_name="gpsdb"; // Table name
// Connect to server and select database.
$con=mysql_connect("$host", "$username")or die("
cannot connect");
mysql_select_db("$db_name")or die("
cannot select DB");
$data = mysql_query("SELECT speed FROM gpsdb WHERE DeviceId=1234 ORDER BY TIME DESC LIMIT 1")
or die(mysql_error());
while ($nt = mysql_fetch_assoc($data))
{
$speed = $nt['speed'];
$jsonTable = json_encode($speed);
echo $jsonTable;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>
Google Visualization API Sample
</title>
<script type="text/javascript" src="//www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('visualization', '1', {packages: ['gauge']});
</script>
<script type="text/javascript">
function drawVisualization() {
// Create and populate the data table.
var data = new google.visualization.DataTable(<?=$speed?>);
// Create and draw the visualization.
new google.visualization.Gauge(document.getElementById('visualization')).
draw(data);
}
google.setOnLoadCallback(drawVisualization);
</script>
</head>
<body style="font-family: Arial;border: 0 none;">
<div id="visualization" style="width: 600px; height: 300px;"></div>
</body>
</html>
