原文地址：http://hi.baidu.com/lj2tj/item/557d8d1a65adfa721009b58b
----------------------------------------------------------------------------------------------
Canvas 画圆
W3School中对Canvas的画圆方法的描述如下：
语法
arc(x, y, radius, startAngle, endAngle, counterclockwise)
x, y 描述弧的圆形的圆心的坐标。
radius 描述弧的圆形的半径。
startAngle,
endAngle 沿着圆指定弧的开始点和结束点的一个角度。这个角度用弧度来衡量。
沿着 X 轴正半轴的三点钟方向的角度为 0，角度沿着逆时针方向而增加。
counterclockwise 弧沿着圆周的逆时针方向（TRUE）还是顺时针方向（FALSE）遍历。描述1. 我想很多人对startAngle和 endAngle两个参数不是很理解，我也是，经过摸索有了一点头绪，总结如下：
startAngle： 沿着 X 轴正半轴的三点钟方向的角度为 0，其实说白了很简单，如下图：
|
1
2
3
4
5
|
ctx.fillStyle=grd;ctx.beginPath();ctx.arc(150,50,50,0,Math.PI/2,false);ctx.closePath();ctx.fill(); |
这个图片的0度角就是图中圆的半径与X轴右方向的夹角，所以顺时针画出来的圆就是上面的效果
2. 角度的表示：在我上面的代码中角度是Math.PI/2，初看可能不明白，其实仔细看一下就会想起来，这个是弧度，不明白就百度吧。
那么如果我按照角度写会如何呢？
|
1
2
3
4
|
ctx.beginPath();ctx.arc(150,50,50,0,360,true);ctx.closePath();ctx.fill(); |
分别打开IE9,FF，Chrome看一下，奇怪的事情发生了：
IE9 和FF:
Chrome:
不知道到底是什么原因，既然不知道原因，那么我们还是老老实实的使用弧度吧