H5canvas 1：画圆

H5canvas画圆

    今天整理了一下自己的文档，发现之前学的canvas还挺好玩的。
首先是canvas画圆：
它的html代码和CSS代码很简单

<h2>Canvas——画圆</h2>
<canvas id="myCanvas" width="400" height="300"></canvas>

body{
	text-align: center;
	}
#myCanvas{
	border: 1px solid #000;
	}

打好框架之后就可以写js文件了。

var c=document.getElementById("myCanvas");  ///获取画布id为myCanvas
var ctx=c.getContext("2d"); //获取绘图2D环境
var w=c.width;
var h=c.height;
ctx.strokeStyle="#ff0000";  //线段颜色
ctx.lineWidth=5;
ctx.arc(w/2,h/2,100,0,2*Math.PI,true); //创建弧/曲线（用于创建圆形或部分圆）
ctx.stroke();  //画直线

这个就是最简单的圆形了。