I have a mySQL table that I've been populating with 3 columns every 5
minutes: DateTime, Temperature, Humidity. I can view the data in the
table and I can see that it's being recorded properly. But now I'd like to
graph it with an annotated line chart, mainly so I can use the zoom buttons
to select different time periods for the x axis. I used the example html
code from the annotated line chart example on the visualization playground
<https://code.google.com/apis/ajax/playground/?type=visualization>, which
works fine on my server with the sample data, but when I add a php script
to get my data from the mySQL table and add it to the data table for the
Google chart, I get the following error :
Uncaught Error: Type mismatch. Value 2014-02-07 22:37:03 does not match
type datetime in column index 0
Here is the section of my php code when viewed from the browser page source
that shows the data it grabbed from the mySQL table:
data.addColumn('datetime', 'Date');
data.addColumn('number', 'Temp');
data.addColumn('number', 'Humid');
data.addRows([
['2014-02-07 22:37:03',6.0,19.6],['2014-02-07
22:42:03',5.5,21.4],['2014-02-07 22:47:03',5.6,20.2],.........
I'm guessing I just don't have the date and time part formatted correctly
and that's why it's not working, but I haven't found any examples of people
who successfully graphed data from a mySQL table when that column is
specified as a "datetime" and not just a "string".
Here's the entire code I wrote that grabs the data and attempts to graph it
with the annotated line chart.
<script type='text/javascript' src='http://www.google.com/jsapi'></script>
<script type='text/javascript'>
google.load('visualization', '1.1', {'packages':['annotationchart']});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('datetime', 'Date');
data.addColumn('number', 'Temperature');
data.addColumn('number', 'Humidity');
data.addRows([
<?php
$db="my_dbname";
$link = mysql_connect('localhost', 'db_username', 'password');
mysql_query('SET NAMES utf8');
mysql_select_db($db , $link) or die("Couldn't open $db: ".mysql_error());
$result = mysql_query("SELECT Date, Temp, Humid FROM datatable Order By
Date");
if ($result !== false) {
$num=mysql_numrows($result);
$i=0;
echo"";
while ($i < $num) {
$Date=mysql_result($result,$i,"Date");
$Temp=mysql_result($result,$i,"Temp");
//$CTDtemp=mysql_result($result,$i,"CTDtemp");
$Humid=mysql_result($result,$i,"Humid");
echo "['";
echo "$Date";
echo "',";
echo "$Temp";
echo ",";
echo "$Humid";
echo "]";
if ($i < ($num - 1))
{
echo ",";
}
$i++;
}
}
?>
]);
var chart = new
google.visualization.AnnotationChart(document.getElementById('chart_div'));
var options = {
displayAnnotations: false,
};
chart.draw(data, options);
}
</script>
</head>
<body>
Graph should be here.
<div id='chart_div' style='width: 900px; height: 500px;'></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 post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/groups/opt_out.
