Canvas move object in circle

Question

I have a rectangle in canvas, and I know how to move it up and sideways. What I want to do is have it move in a circular motion.

So my objects(rectangle) x and y would go in a circle.

Now I am assuming I need a radius for how far out and some formula for the speed(1pixel) to get it rotate on the axis.

Any idea's?

Answer 1

The parametric equation for moving in a circle is this:

x=r*cos(theta)
y=r*sin(theta)

theta is the angle, and r the radius.

If you want to know the change in theta to get the desired speed, solving for the distance d you get that the change in theta is: arccos(1-(d/r)^2/2)

The JavaScript functions are Math.cos, Math.sin, and Math.acos, respsectively. They all deal with radians.