29 lines
803 B
HTML
29 lines
803 B
HTML
<!-- Learn about this code on MDN: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_usage -->
|
|
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
<script type="application/javascript">
|
|
function draw() {
|
|
var canvas = document.getElementById("canvas");
|
|
if (canvas.getContext) {
|
|
var ctx = canvas.getContext("2d");
|
|
|
|
ctx.fillStyle = "rgb(200,0,0)";
|
|
ctx.fillRect (250, 10, 50, 50);
|
|
|
|
ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
|
|
ctx.fillRect (230, 30, 50, 50);
|
|
ctx.fillRect(25,25,100,100);
|
|
ctx.clearRect(45,45,60,60);
|
|
ctx.strokeRect(50,50,50,50);
|
|
}
|
|
}
|
|
</script>
|
|
</head>
|
|
<body onload="draw();">
|
|
<canvas id="canvas" width="640" height="480" style="border: 1px solid black;"></canvas>
|
|
</body>
|
|
</html>
|