16
\$\begingroup\$

I'm working on a dial that rotates around a circle.

before click

This dial should lets you mousemove anywhere in a circle to adjust the position of the dial to a point on the circle with the same angle as the click. For example, from the dial above if you clicked the spot shown in pink below I'd move the dial above that point but on the circle.

after click (pink)

I know how to get the position of a point on a circle given a radius and an angle (in radians). That's this formula:

x = Cos(angle) * radius + CenterX; y = Sin(angle) * radius + CenterY;

However, I am looking to do somewhat of the opposite -- I've got a click point, which I want to turn into a point on a circle (where the control knob goes). I'm trying to use this point (and a given radius) to figure out the angle in radians for it, so that I can place the control knob on the circle at the same angle.

Is there a handy formula I can use to accomplish this?

\$\endgroup\$
5
  • \$\begingroup\$ Are you looking for the formula to get an angle between to points? \$\endgroup\$ Commented Aug 6, 2012 at 15:24
  • \$\begingroup\$ Can you get an angle between two points? I can calculate slope but my guess was that I need a third point to create a triangle and use an inverse trigonomic function to solve this. \$\endgroup\$ Commented Aug 6, 2012 at 15:26
  • \$\begingroup\$ I posted an answer showing how to do it. \$\endgroup\$ Commented Aug 6, 2012 at 15:34
  • 3
    \$\begingroup\$ What you really have here is the angle between two vectors. They both originate from the center of the circle and have the same magnitude (radius of the circle). \$\endgroup\$ Commented Aug 6, 2012 at 15:51
  • \$\begingroup\$ Here's the mathematics behind it: inverse trig functions. atan is short for arctan, and atan2 is just a function that accepts individual arguments, and does the division for you. \$\endgroup\$ Commented Aug 7, 2012 at 2:08

3 Answers 3

Reset to default
26
\$\begingroup\$

Check out the atan2 function.

It gives you the angle between (0, 0) and (x, y), x and y being the function arguments.

Edit: if the center of the circle isn't (0, 0), no matter, just do this: atan2(y - cy, x - cx).

\$\endgroup\$
5
  • \$\begingroup\$ Does it matter if the center of my circle is not at (0,0)? I'm guessing I just offset the arguments to atan2 as shown by @Luis below? \$\endgroup\$ Commented Aug 6, 2012 at 15:47
  • \$\begingroup\$ Just translate by subtracting. See the edit. \$\endgroup\$ Commented Aug 6, 2012 at 16:03
  • 3
    \$\begingroup\$ -1: The first parameter for atan2 is y \$\endgroup\$ Commented Aug 7, 2012 at 14:44
  • 2
    \$\begingroup\$ Thanks @LuisEstrada, I just corrected it. (Hopefully you'll make it a +1. :)) \$\endgroup\$ Commented Aug 7, 2012 at 14:46
  • \$\begingroup\$ +Luis Estrada Sorry to nnecro-bump this, but I had to thank you. I've been trying to debug my program for a day and a half now. It turns out, the arguments to atan2 were backward! \$\endgroup\$ Commented Aug 16, 2016 at 13:15
8
\$\begingroup\$

You need the center of the knob and the point of the cursor along with the atan2 function. You then use it like this:

 angle = atan2(mouseY - knobCenterY, mouseX - knobCenterX)
\$\endgroup\$
5
\$\begingroup\$ 
Point clickPoint; float angle = Math.atan2(clickPoint.Y - CenterY, clickPoint.X - CenterX);

An ok reference: http://www.mathsisfun.com/polar-cartesian-coordinates.html

\$\endgroup\$

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.