拖动以旋转SVG:g组

Zac*_*chB 5 html5 svg transform rotation d3.js

我的目标是拥有一个svg:ellipse可用于调整大小和旋转的四个控制点.如果旋转变换应用于椭圆本身,我的代码工作正常,但我想将旋转应用于容器,svg:g以便控制点同时旋转而无需额外的代码.当我将变换应用于组时,我认为旋转行为不正确,因为我没有正确地考虑变换的坐标.

见这里:http://jsfiddle.net/PbKYn/3/

请注意,角度在旋转开始附近的正值和负值之间闪烁,而鼠标的2pi旋转仅旋转形状1pi.(我不认为我的angleBetweenPoints功能是错误的,因为如果我将旋转应用于<ellipse>而不是<g>旋转,则旋转是完美的.)

我究竟做错了什么?谢谢-

Zac*_*chB 12

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

该修复将旋转角度从更改angleBetweenPointscurrentAngle + angleBetweenPoints(伪).我认为这意味着在应用旋转之后,坐标也被转换angleBetweenPoints为基本上给出dTheta而不是theta.叹了口气.