Wyrazy krążące po elipsie/okręgu - JS


(Marcin) #1

Witam,

Wie ktoś może jak zrobić w JavaScript/Jquery albo zna skrypt, aby parę wyrazów krążyło po elipsie lub okręgu.

Pozdrawiam


(Grzegorz Olszewski) #2

Bardzo prosto... Każdy wyraz wpisujesz w spana, dajesz spanom position:absolute. Wsadzasz wszystkie spany do diva o rozmiarze 1px (też musi mieć styl position, np. absolute, relative czy fixed), który będzie środkiem okręgu. I teraz dla każdego spana z wyrazem łatwo obliczyć współrzędne według wzoru na okrąg:

eaf322f7fce919d0840cedfe2476ebb3.png

Do obliczenia sinusa i cosinusa są funkcje Math.sin() i Math.cos().

Korygujesz tylko współrzędne o szerokość i wysokość spana, żeby na okręgu znalazł się jego środek, a nie lewy górny róg.

Dzielisz okrąg na tyle części, ile masz wyrazów, i każdemu przypisujesz odpowiedni kąt α, żeby były równomiernie rozłożone na okręgu. I teraz wystarczy cyklicznie, np. co 30 milisekund za pomocą funkcji setInterval(), zmieniać kąt α każdego spana o jakąś niewielką wartość , żeby równomiernie krążyły, i przeliczać współrzędne.


(Marcin) #3

Czaje, super, dzięki wielkie!