title: Rotating flex graphic object around center
body: <p>I tried to create a rotating animation of an arc. Even after trying all those examples, I am not able to rotate it around the center. It is getting rotated around the top left corner. </p>
  
  <pre><code>private function init():void
          {
              var hgroup:Group=new Group();
              this.addElement(hgroup);
  
              arc1=new Graphic();
              arc1.graphics.lineStyle(12,0xff0000,1,false,"normal",CapsStyle.SQUARE);
              draw_arc(arc1,CENTER,CENTER,70,14,288,1);
  
              hgroup.addElement(arc1);
  
              var matrix:Matrix = arc1.transform.matrix; 
              var rect:Rectangle = arc1.getBounds(arc1.parent); 
              matrix.translate(- (rect.left + (rect.width/2)), - (rect.top + (rect.height/2))); 
              matrix.rotate((90/180)*Math.PI); 
              matrix.translate(rect.left + (rect.width/2), rect.top + (rect.height/2));
  
              var rot:Rotate = new Rotate();
              rot.angleBy = 360;
              rot.duration = 1000;
              rot.target = arc1;
              rot.play();
  
          }
  
          public function draw_arc(movieclip:Sprite,center_x:Number,center_y:Number,radius:Number,angle_from:Number,angle_to:Number,precision:Number):void {
              var angle_diff:Number=angle_to-angle_from;
              var steps:Number=Math.round(angle_diff*precision);
              var angle:Number=angle_from;
              var px:Number=center_x+radius*Math.cos(angle*deg_to_rad);
              var py:Number=center_y+radius*Math.sin(angle*deg_to_rad);
              movieclip.graphics.moveTo(px,py);
              for (var i:Number=1; i&lt;=steps; i++) {
                  angle=angle_from+angle_diff/steps*i;
                  movieclip.graphics.lineTo(center_x+radius*Math.cos(angle*deg_to_rad),center_y+radius*Math.sin(angle*deg_to_rad));
              }
          }
  </code></pre>