|
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Test canvas</title>
<script>
function drawPicture() {
var canvas = document.querySelector("#myCanvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "#FFCCDD";
ctx.fillRect(0, 0, 200, 100);
ctx.beginPath();
ctx.arc(95, 50, 40, 0, 2 * Math.PI);
ctx.stroke();
ctx.font = "30px Arial";
ctx.fillStyle = "cyan";
ctx.fillText("Hello World", 10, 50);
}
</script>
</head>
<body onload="drawPicture()">
<canvas id="myCanvas" width="200" height="100" style="border: 1px solid black"></canvas>
</body>
</html>
| 
