Make a visual object in Flex 4 move along a circular motion path

Question

I can't seem to figure out how to accomplish a fairly simple task: I have a simple graphic and I'd like to apply an "orbiting" effect to it - so that the graphic moves in a circle around an arbitrary point (without rotating around its own center).

<s:Ellipse id="circle" width="100" height="100">
  <s:fill>
    <s:SolidColor color="0x000000" />
  </s:fill>
</s:Ellipse>

I was trying to do something using spark.effects.Animate but couldn't figure out how to configure motion paths - I started thinking about Cartesian vs Polar coordinate systems and appropriate circle equations for each and then realized I was probably over-thinking it. Although I consider this to be a fairly common problem searching the Web yielded no results.

P.S. I'd like to use Flex 4 as much as possible, so I'd appreciate it if the answers reused Flex 4 classes.

Answer 1

You can use trig to find the circumference:

var radius = 50;
for (var i:int = 0, imax:int = 359) : void {
    var radians:Number = i * (Math.PI/180);
    pointX = radius * Math.cos(radians);
    pointY = radius * Math.sin(radians);
    // position something at pointX,pointY
}

This goes once around a circle and plots a point for each degree. You would probably want to figure out the offsets from x,y for your orbiting and orbited elements so that the former's center would appear to orbit around the latter's.