Hi All,
I am new to Google charts and this forum.
For some time now I have been trying to graph temperature against time from
data I am logging to MySQL, using a variety of different applications /
java scripts / methods.
It was not until I first tried Google Charts that I was able to achieve any
kind of success.
My DB table has 3 columns:-
- ID
- Time
- Temperature
Starting with a working Pie Chart example, I was able to make the necessary
changes to create a fully functioning line chart to plot temperature
against ID, however when I update the code to plot against time I get the
following error:-
Object doesn't support property or method 'getTimezoneOffset'
Any suggestions as to where in the code below could be causing the problem,
would be greatly appreciated.
Thanks
Darren
$result = $mysqli->query('SELECT Temperature, Time FROM dp00000001 ORDER
BY ID DESC LIMIT 2000');
$rows = array();
$table = array();
$table['cols'] = array(
array('label' => 'Time', 'type' => 'datetime'),
array('label' => 'Temperature', 'type' => 'number')
);
/* Extract the information from $result */
foreach($result as $r) {
$temp = array();
$temp[] = array('v' => (int) $r['Time']);
$temp[] = array('v' => (float) $r['Temperature']);
$rows[] = array('c' => $temp);
}
$table['rows'] = $rows;
$jsonTable = json_encode($table);
?>
<html>
<head>
<meta http-equiv="refresh" content="600">
<!--Load the Ajax API-->
<script type="text/javascript" src="
https://www.google.com/jsapi";></script>
<script type="text/javascript" src="
http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js";></script>
<script type="text/javascript">
// Load the Visualization API and the piechart package.
google.load('visualization', '1', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
function drawChart() {
// Create our data table out of JSON data loaded from server.
var data = new google.visualization.DataTable(<?=$jsonTable?>);
var options = {
title: 'Temperature',
curveType: 'function',
width: 1200,
height:400,
explorer:{maxZoomIn:10,
actions:["dragToZoom","rightClickToReset"],axis: "horizontal"
}
};
// Instantiate and draw our chart, passing in some options.
// Do not forget to check your div ID
var chart = new
google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<!--this is the div that will hold the pie chart-->
<div id="chart_div"></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 https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit
https://groups.google.com/d/msgid/google-visualization-api/e105c322-3f54-49f5-951d-63f44d7d673b%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
