javascript - 计算末端旋转圆

Question

我有一个圆，通过在一个循环中操纵半径来扩大和缩小。在扩大和缩小的同时，我在那个圆圈上画了一个点。在同一个循环中，增加下一个点的 Angular 。

设置是这样的:

let radius = 0;
let circleAngle = 0;
let radiusAngle = 0;

let speed = 0.02;
let radiusSpeed = 4;
let circleSpeed = 2;

在循环中:

radius = Math.cos(radiusAngle) * 100;

// creating new point for line  
let pointOnCircle = {
    x: midX + Math.cos(circleAngle) * radius,
    y: midY + Math.sin(circleAngle) * radius
};

circleAngle += speed * circleSpeed;
radiusAngle += speed * radiusSpeed;

这会产生某种要绘制的花朵/图案。经过未知的旋转后，绘图线连接到它开始的点，完美地关闭了路径。

现在我想知道在线路回到起点之前必须进行多少次旋转。

可以在这里找到一个工作示例: http://codepen.io/anon/pen/RGKOjP

控制台记录圆和线的当前旋转。

Answer 1

当半径和点都回到起点时，一个完整的循环结束。所以

speed * circleSpeed * K = 360 * N
speed * radiusSpeed * K = 360 * M

此处K为未知圈数，N、M为整数。

用第一个方程除以第二个方程

circleSpeed / radiusSpeed  = N / M

如果速度值是整数，将它们除以 LCM 得到最小有效 N 和 M 值，如果它们是有理数，将它们相乘得到整数比例。

对于您的示例最小整数 N=1,M=2，因此我们可以得到

K = 360 * 1 / (0.02 * 2) = 9000 loop turns