--- In [email protected], "th_w@..." <th_w@...> wrote: > > --- In [email protected], "th_w@" <th_w@> wrote: > > > > --- In [email protected], Cameron McCormack <cam@> wrote: > > > > > > David Dailey: > > > > Oh good! The center of mass (centroid or first central moment) is also a > > > > graphically relevant construct, so we should think about that too! > > > > Itâs > > > > easily scriptable for integrable curves (well, heck, I suppose they > > > > donât even need to be integrable* do they?) but declarative access to > > > > the centroid would be good for realistic rotation (even sans gravity). > > > > > > Yeah, I should've said that the percentages in transform-origin will be > > > the bounding box of the object. (There is still the issue of *which* > > > bounding box to use -- the geometry one that getBBox() provides, one > > > that include the stroke, markers, etc...) Centroids may also be useful, > > > but supporting bounding boxes is a good simple first step. > > > > > > > Another problem I see is that during the animation the center of the > > bounding box may constantly be shifting. > > > > http://wwwpub.zih.tu-dresden.de/~s9783698/svg/bbRotate.svg > > > > > > <?xml version="1.0" encoding="UTF-8"?> > > <svg xmlns="http://www.w3.org/2000/svg"; width="100%" height="100%" > > onload="init()"> > > <script type="text/ecmascript"> > > var polygon > > var polygonContainer > > var bboxCenterMarker > > > > var angle = 0 > > var angleIncrement = 5 > > var interval = 50 > > > > function init() { > > polygonContainer = document.getElementById('polygonContainer') > > polygon = polygonContainer.getElementsByTagName('polygon')[0] > > bboxCenterMarker = document.getElementById('bboxCenterMarker') > > animate() > > } > > > > function animate() { > > polygon.setAttribute('transform','rotate('+angle+')') > > angle += angleIncrement > > var bbox = polygonContainer.getBBox() > > bboxCenterMarker.setAttribute('cx',bbox.x + .5 * bbox.width) > > bboxCenterMarker.setAttribute('cy',bbox.y + .5 * bbox.height) > > window.setTimeout('animate()',interval) > > } > > </script> > > <g transform="translate(100,100)" id="polygonContainer"> > > <polygon points="-50,-20 50,-20 -30,20, -50,20" stroke="black" > > fill="none"/> > > <circle r="2" fill="green"/> > > <circle r="2" stroke="red" fill="none" id="bboxCenterMarker"/> > > </g> > > <text x="10" y="200">Green circle: Rotation center (initial bounding box > > center)</text> > > <text x="10" y="220">Red circle: Momentary bounding box center</text> > > </svg> > > > > Sorry, there must be something wrong here. In Firefox, the red circle is > shifting around as I expected, but not in Opera and Chromium. >
It looks like a bug in Firefox IMHO. The transformation shouldn't influence the objectBoundingBox of the element. Thats why both circles stay at the same point during the animation on Opera and WebKit. ------------------------------------ ----- To unsubscribe send a message to: [email protected] -or- visit http://groups.yahoo.com/group/svg-developers and click "edit my membership" ----Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/svg-developers/ <*> Your email settings: Individual Email | Traditional <*> To change settings online go to: http://groups.yahoo.com/group/svg-developers/join (Yahoo! ID required) <*> To change settings via email: [email protected] [email protected] <*> To unsubscribe from this group, send an email to: [email protected] <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
