Canvas Lines
Source Code
<script type="text/javascript">
var drawLines = function() {
var canvas = document.getElementById('canvasLines');
if (canvas.getContext) {
var ctx = canvas.getContext('2d');
var width = window.innerWidth - ctx.canvas.offsetLeft - 20;
var height = window.innerHeight - ctx.canvas.offsetTop - 20;
ctx.canvas.width = width;
ctx.canvas.height = height;
ctx.strokeStyle = '#0000FF';
for (var x = 0; x < width; x += 8) {
var y = x * height / width;
ctx.moveTo(0, y);
ctx.lineTo(x, height);
ctx.stroke();
}
}
}
window.onload = drawLines;
</script>
<h1>Canvas Lines</h1>
<canvas id="canvasLines" width="200" height="200">
<p>Canvas is not supported on this browser.</p>
</canvas>