円を描こう

HTML5

Sample04.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8"/>
<title>Sample04.html</title>
<script>
function draw() {
	var canvas = document.getElementById("canvas1");
	var c = canvas.getContext("2d");
	c.strokeStyle = "#ff9900";
	c.beginPath();
	c.arc(70, 70, 60, 0, Math.PI*2, false);
	c.stroke();
}
</script>
</head>
<body onload="draw()">
<canvas id="canvas1" width="300" height="300"></canvas>
</body>
</html>

こんな感じに円を描きます。

円の中を塗りつぶすにはこんな感じですか
Sample05.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8"/>
<title>Sample05.html</title>
<script>
function draw() {
	var canvas = document.getElementById("canvas1");
	var c = canvas.getContext("2d");
	c.fillStyle = "#990099";
	c.beginPath();
	c.arc(70, 70, 60, 0, Math.PI*2, false);
	c.fill();
}
</script>
</head>
<body onload="draw()">
<canvas id="canvas1" width="300" height="300"></canvas>
</body>
</html>

IE9をインストールしたらIE8が使えなくて、不便（IE9に対応したページがすくないので）
しかたなくIE8に戻してみる