AS3绘制扇形算法解析

网上有很多使用AS3画一个扇形的方法，但是却一个都没有解释这个函数是如何运作来画出扇形的，下面浅谈下我对这个函数的理解。

首先上代码，代码来自http://blog.csdn.net/weiming8517/article/details/12023411。

private function drawSector(mc:Sprite, x:Number = 200, y:Number = 200, r:Number = 100, angle:Number = 60, startFrom:Number = 0, color:uint = 0x000000):void
        {
            mc.graphics.clear();
            mc.graphics.beginFill(color,50);
            mc.graphics.lineStyle(0,color);
            mc.graphics.moveTo(x,y);

            angle=(Math.abs(angle)>360)?360:angle;

            var n:Number=Math.ceil(Math.abs(angle)/45);

            var angleA:Number=angle/n;

            angleA=angleA*Math.PI/180;

            startFrom=startFrom*Math.PI/180;

            mc.graphics.lineTo(x+r*Math.cos(startFrom),y+r*Math.sin(startFrom));

            for(var i:int = 1;i <= n;i++)
            {
                startFrom+=angleA;

                var angleMid:Number = startFrom-angleA/2;

                var bx:Number=x+r/Math.cos(angleA/2)*Math.cos(angleMid);

                var by:Number=y+r/Math.cos(angleA/2)*Math.sin(angleMid);

                var cx:Number=x+r*Math.cos(startFrom);

                var cy:Number=y+r*Math.sin(startFrom);

                mc.graphics.curveTo(bx,by,cx,cy);
            }

            if(angle!=360)
            {
                mc.graphics.lineTo(x,y);
            }

            mc.graphics.endFill();
        }

画扇形函数

其中，angle是我用60度，起始点是(200,200)，半径100，从右开始画，这样可以理解的容易些。

第一步，把要画的扇形角度等份分解成几个小部分，每部分不超过45度，同时因为等份分解，每部分的弧度也就相等，这里分成了2个30度。

第二步，对每个小部分绘制贝塞尔曲线，曲线需要3个点：起点，控制点，终点。

起点即当前绘图位置，第一次调用时，当前绘图位置在(300,200)，图中起点是D点。

终点即这次小部分绘制中，最后要到达的点，图中终点是E点。

控制点是用来控制曲线弯曲的程度，曲线不会经过控制点，只会达到控制点与（起点与终点的连线即直线DE）的垂线的一半，图中C是控制点。

从图中可见，绿色线表示扇形的弧线，弧线最远也只达到C点的一半，这样这一部分的扇形就画好了。

PS:请无视图中的Y坐标，这是几何画板里的直角坐标系，非flash坐标系

第三步，重复第二步的过程，直到角度全画完。

第四步，返回最开始的起点（200,200），绘制完成。

补充：这个方法画的扇形其实还是有点误差的，图中的绿色弧线是圆的一部分，O是圆点，所以OD=OB=OE=100,角DOE是30度,OC垂直DE，CD垂直OD，可以轻松算出OA长度是100*cos(15度)，OC长度是100/cos（15度），然后就可得出AB、BC的长度很相近但是不相等的，而贝塞尔曲线的控制点C是在AB延长线上且AB'=B'C，所以B'会是比图中的B更靠近A一点点的地方。所以说这个函数方法只是相似的画了一个扇形。