SVG Positioning
Source : Lion Kimbro's Blog
Okay! I’ve figured out how to translate a mouse position to an SVG position in Firefox 1.5. Check it out for yourself – double click around the triangle, and little red boxes should appear. If you scroll the window down a bit, the boxes should keep appearing in the right position– wherever you click. Yeah, I know, it sounds pretty dumb. But, this kind of thing is actually notoriously difficult. The basic technique is like so: Aquire your SVG element. Figure out it’s transformation matrix. Aquire an SVG point. You’re going to use this to interact with the matrix. Get your mouse click position, in terms of “the DOM implementation’s client area,” and fill out the point. Now transform it! …by the inverse of the transformation matrix. In code: svg = document.getElementById('my_svg'); m = svg.getScreenCTM(); p = svg.createSVGPoint(); p.x = evt.clientX; p.y = evt.clientY; p = p.matrixTransform(m.inverse()); Make sure to look at the source code for: http://taoriver.net/oneoff/svgposition/index.xml See also: How to enable dragging in SVG, and quirksmode: Mouse position.
Lion
le 19.06.06 à 23:11
dans Mind
- 
Article précédent - Commenter - Article suivant -