Skip to content

Instantly share code, notes, and snippets.

@yesidays
Created June 29, 2012 16:48
Show Gist options
  • Save yesidays/3019131 to your computer and use it in GitHub Desktop.
Save yesidays/3019131 to your computer and use it in GitHub Desktop.
Primeros pasos con HTML5
<!DOCTYPE html>
<html>
<head></head>
<title>HTML5 : Canvas</title>
<script type='text/javascript'>
function loadCanvas() {
var canvas = document.getElementById('canvas');
var graph = canvas.getContext('2d');
graph.fillStyle = "rgba(200, 200, 0, 1)";
graph.fillRect(10, 20, 155, 70);
graph.fillStyle = "rgba(0, 0, 200, 1)";
graph.fillRect(30, 70, 75, 70);
graph.beginPath();
graph.arc(120, 110, 38, 0, Math.PI * 2, true);
graph.closePath();
graph.fillStyle = "rgba(60, 50, 120, 0.75)";
graph.fill();
graph.font = "bold 50px sans-serif";
graph.strokeStyle = "rgba(170, 60, 50, 100)";
graph.fillText("Hola :)", 200, 100);
graph.font = "italic 40px sans-serif";
graph.strokeStyle = "rgba(170, 60, 50, 100)";
graph.strokeText("@silvercorp", 10, 200);
}
</script>
</head>
<body onload="loadCanvas()">
<div align="center">
<canvas id="canvas" width="600" height="500"></canvas>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment