svg - 求圆上点的度数 (0-360º)

Question

我正在开发一个需要旋转形状的小型 web 应用程序。一世
想通过捕获圆上的一个点来实现这一点，然后
拖动它来旋转图像。

这是一个快速的插图来帮助解释事情:



我的主圆圈可以拖到 Canvas 上的任何地方。我知道这是
半径 (r) 并且 12 点钟 (p0) 将始终为 (cx, cy - r)。什么
我需要知道 p1 的度数 (0-360º) 以便我可以旋转
相应地使用 Raphael.rotate() 主圆的内容。

我已经运行了一堆不同的 JavaScript 公式来找到这个( example )，但似乎没有一个给我 0-360 和我的基本数学技能之间的值
严重不足。

Color Picker demo (沿着右边的环滑动光标)有我想要的行为，但即使在仔细研究源代码后，我似乎也无法准确地复制它。

任何能指出我正确方向的东西都将不胜感激。

Answer 1

// Angle between the center of the circle and p1,
// measured in degrees counter-clockwise from the positive X axis (horizontal)
( Math.atan2(p1.y-cy,p1.x-cx) * 180/Math.PI + 360 ) % 360

圆心和 p0 之间的角度将始终为 +90°。见 Math.atan2 更多细节。