Skip to content

Instantly share code, notes, and snippets.

@colinfwren
Created June 27, 2011 20:03
Show Gist options
  • Save colinfwren/1049694 to your computer and use it in GitHub Desktop.
Save colinfwren/1049694 to your computer and use it in GitHub Desktop.
jsgauge example markup (based on the Google Chart Tools example)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Gauge demo</title>
<!--[if IE]><script type="text/javascript" src="excanvas.js"></script><![endif]-->
<script type="text/javascript" src="../gauge.js"></script>
</head>
<body>
<canvas id='chart_div' width="400" height=""120></canvas>
<script type="text/javascript">
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}
addLoadEvent( function() {
var options;
options = {
value: 80,
label: 'Memory',
min: 75,
max: 100,
minorTicks: 5, // small ticks inside each major tick
yellowFrom: 75,
yellowTo: 90,
redFrom: 90,
redTo: 100
};
new Gauge( document.getElementById( 'chart_div'), options );
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment