title: How to draw a series of arc segments across line segments
body: <p>I'm  trying to draw a 'countdown' circle that will produce a visual clock, but don't like the resulting shape as it is not smooth. The code below draws and fills a series of triangles that approximate a circle when the variable 'numberOfSides' is sufficiently large, but this is both inefficient and produces an ugly 'circle.' What I would like to do is draw a series of arcs across the line segments but I don't know how to do it. Can anyone give me a prod in the right direction?</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="955" minHeight="600" frameRate="100" creationComplete="init()"&gt;
  &lt;mx:Script&gt;
      &lt;![CDATA[
          private var numberOfSides:int = 10;
          private var angle:Number = 0;
          private var lineLength:int = 100;
          private var xStartingPos:int = 300;
          private var yStartingPos:int = 300;
          private var i:int = 90;//Start the drawing  at 0 to 360;
          private var speed:int = 100;
          private var timer:Timer  
          private function init():void{
              //uic.graphics.lineStyle(1);
              uic.graphics.moveTo(xStartingPos,yStartingPos);
              uic.graphics.beginFill(0xffff00);
              timer = new Timer(speed, numberOfSides + 1);
              timer.addEventListener(TimerEvent.TIMER,cont);
              timer.start()
          }
          private function cont(event:TimerEvent):void{
                  angle = (Math.PI / numberOfSides * 2) * i;
                  var xAngle:Number = Math.sin(angle);                 
                  var yAngle:Number = Math.cos(angle);
                  var xResult:int = xAngle * lineLength;
                  var yResult:int = yAngle * lineLength;
                  uic.graphics.lineTo(xStartingPos + xResult, yStartingPos + (yResult*-1));
                  i++
          }
      ]]&gt;
  &lt;/mx:Script&gt;
  &lt;mx:Canvas  id="uic"/&gt;
  &lt;/mx:Application&gt;
  </code></pre>