Przeciągnij, aby obrócić SVG: grupa g

Question

Mój cel to uzyskanie svg:ellipse z czterema punktami kontrolnymi, których można użyć do zmiany rozmiaru i obracania. Mój kod działa dobrze, jeśli transformacja obrót jest zastosowana do samej elipsy, ale chcę zastosować obrót do kontenera svg:g, aby punkty kontrolne obróciły się jednocześnie bez dużej ilości dodatkowego kodu. Kiedy zastosuję transformację do grupy, rotacja źle działa, zakładam, ponieważ nie myślę właściwie o przekształconych współrzędnych.

Zobacz tutaj: http://jsfiddle.net/PbKYn/3/

Zauważ, że kąt pomiędzy migoczącego pozytywnej i negatywnej wartości bliskiej początku obrotu i że 2pi obrót myszy obraca się tylko kształt 1pi. (Nie sądzę, mój angleBetweenPoints funkcja jest źle chociaż, ponieważ jeśli stosuje rotację do <ellipse> a nie <g>, rotacja jest doskonały.)

Co robię źle? Thanks-

Answer 1

http://jsfiddle.net/PbKYn/5/

Rozwiązaniem było zmiany kąta obrotu z angleBetweenPoints do currentAngle + angleBetweenPoints (pseudo). Myślę, że oznacza to, że po zastosowaniu obrotu, współrzędne zostały również przekształcone tak, że angleBetweenPoints był zasadniczo dając dTheta zamiast theta. Le westchnienie.