Skip to content

Instantly share code, notes, and snippets.

@ericevenchick
Created February 28, 2013 02:19
Show Gist options
  • Save ericevenchick/5053655 to your computer and use it in GitHub Desktop.
Save ericevenchick/5053655 to your computer and use it in GitHub Desktop.
A simple html5 gauge.
<!doctype html>
<html>
<head>
</head>
<body>
<canvas id='gauge' width=400 height=400>
<script>
drawGauge = function(canvasId, angle, length) {
var gaugeCanvas = document.getElementById(canvasId);
var ctx = gaugeCanvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(200,400);
ctx.lineTo((200 - length*Math.cos(angle)), (400 - length*Math.sin(angle)));
ctx.stroke();
ctx.closePath();
}
drawGauge('gauge', Math.PI/4, 130);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment