Analysis of AS3 drawing sector algorithm

There are many ways of using AS3 to draw a fan, but none of them explain how the function works to draw a fan, and below I understand the function.

First on the code, the code comes from http://blog.csdn.net/weiming8517/article/details/12023411.

Private functionDrawsector (Mc:sprite, x: Number= x, y: Number= A, R: Number= Angle: Number= 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; varN: Number=math.ceil (Math.Abs (angle)/45);varAnglea: Number=angle/NAnglea=anglea*math.pi/180;Startfrom=startfrom*math.pi/180;mc.graphics.lineTo (x+r*math.cos (Startfrom), y+r*Math.sin (Startfrom));  for(varI:int = 1;i <= n;i++) {Startfrom+=Anglea; varAnglemid: Number= Startfrom-anglea/2;varBx: Number=x+r/Math.Cos (Anglea/2) *Math.Cos (Anglemid); varBy Number=y+r/Math.Cos (Anglea/2) *Math.sin (Anglemid); varCx Number=x+r*Math.Cos (Startfrom); varCy Number=y+r*Math.sin (Startfrom);            Mc.graphics.curveTo (Bx,by,cx,cy); }                        if(angle!=360) {mc.graphics.lineTo (x, y);         } mc.graphics.endFill (); }

Draw Sector functions

Among them, angle is I use 60 degrees, the starting point is (200,200), the radius of 100, from the right to start painting, so it is easier to understand.

The first step is to divide the fan-shaped angles into a few small parts, each of which is not more than 45 degrees, and because the equal parts are decomposed, the radian of each part is equal, and it is divided into 2 30 degrees.

In the second step, to draw a Bezier curve for each part, the curve requires 3 points: The starting point, the control point, and the end point.

The starting point is the current drawing position, and the first call is the current drawing position at (300,200), where the start point is D.

The end point is the small part of the drawing, the last points to reach, the end of the figure is the E point.

The control point is used for controlling the degree to which the curve bends, the curve does not pass through the control point, and only half of the vertical line of the control point and (the connection between the start and end points), and C is the control point.

It can be seen that the Green line represents a fan-shaped arc, and the arc farthest reaches only half of the C point, so that this part of the pie is painted well.

PS: Ignore the y-coordinate in the figure, which is the Cartesian coordinate system in the geometry artboard, not the flash coordinate system

The third step, repeat the process of the second step, until the angle is complete.

Fourth step, return to the beginning of the starting point (200,200), drawing completed.

Add: This method is actually still a bit of error, the green arc is a part of the Circle, O is a dot, so od=ob=oe=100, Angle doe is 30 degrees, OC vertical DE,CD vertical od, can easily calculate the length of OA is 100*cos (15 degrees), OC length is 100 /cos (15 degrees), and then can be obtained AB, BC length is very similar but not equal, and the Bézier curve of the control point C is on the ab extension line and ab ' =b ' C, so B ' will be more than the figure of B closer to a a little bit of the place. So this function method is just similar to drawing a fan.

Analysis of AS3 drawing sector algorithm