2016-09-23 81 views
3

我有一個圓圈,它通過操作循環中的半徑來增大和縮小。 在成長和萎縮的同時,我在那個圓圈上畫了一個點。在同一個循環內,增加下一個點的角度。計算結束旋轉圓圈

的設置是這樣的:

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

控制檯登錄圓和線兩者的當前旋轉。

+0

真的很酷的東西我得到的所有類型的精彩設計的像 [這裏](http://codepen.io/anon/pen/pEZzVB)只需調整圓速度和角速度即可。我們需要一些trigo。親謝謝@Novice回答這個 – Viney

+0

。我想知道結尾,所以我可以關閉路徑/停止動畫並填寫例如 – Pimmol

回答

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 
+0

謝謝@Mbo,但我恐怕我不理解它。當記錄N = 1和M = 2的轉彎時,'radiusAngle'的總旋轉角度爲360度(1轉)。對於'circleAngle',它是720度(2圈)。這如何轉化爲9000? – Pimmol

+0

9000圈,9000點 – MBo