[Javascript] Rysowanie okręgu przy użyciu krzywych Beziera

m1rox
Użytkownik
Użytkownik
Posty: 1
Rejestracja: 26 maja 2014, o 22:08
Płeć: Mężczyzna
Lokalizacja: Warszawa

[Javascript] Rysowanie okręgu przy użyciu krzywych Beziera

Post autor: m1rox »

Witam,

to mój pierwszy post na tym forum, więc prosiłbym o wyrozumiałość. Poza tym nie zajmuję się zawodowo matematyką, toteż nie znam odpowiednich terminów, ale mój problem jest jak najbardziej matematyczny

Piszę skrypt do manipulacji grafiką wektorową (SVG) i potrzebuję zrobić animację rozciągnięcia okręgu względem jego osi poziomej. Coś w tym stylu:
AU
AU
W7rWNAv.jpg (5.68 KiB) Przejrzano 54 razy
Stwierdziłem, że najłatwiej będzie to zrobić za pomocą krzywych beziera (dokładniej cubic bezier curves - czyli tych z dwoma punktami kontrolnymi). Całość wyglądałaby tak jak na rysunku poniżej:
AU
AU
Dkp0ga0.jpg (73.92 KiB) Przejrzano 54 razy
Moje pytanie jest następujące - jak wyliczyć położenie punktów kontrolnych (niebieskie kropeczki) oraz punktów startowych (czerwone kwadraciki)? Znalazłem odpowiedni artykuł na Wikipedii z przykładem wyliczenia tych punktów dla okręgu składającego się z czterech części - , z tym że nie do końca rozumiem ten wzór. Dlatego prosiłbym o pomoc.

Pozdrawiam
ODPOWIEDZ