Friday, 15 August 2014

javascript - SVG to Screen Coordinate -


I was wandering that nobody could help me with this svg problem. How do I get the mouse coordinate version of a SVG object? Typically when a user clicks on the page, the click event is triggered and the object has the position of the mouse in case of X and Y. In my case, I do not want to do it with an incident. Is it possible to position the mouse by checking the X and Y coordinates of SVG objects properties? I placed an example page, hopefully it clarifies link is the quote:

  var svg = document.getElementsByTagName ('svg') [0]; Var pt = svg.createSVGPoint (); Var el1 = document.getElementsByTagName ('rect') [0]; Var log_svgcursorPoint, log_mouseclick, log_mousecoord; Function svgcursorPoint (evt) {pt.x = evt.clientX; Pt.y = evt.clientY; Var a = svg.getScreenCTM (); Log_svgcursorPoint = "Offset based on SVG" + "x:" + a.e + "y:" + a.f; Var b = a.inverse (); Return pt.matrixTransform (B); }; (Function (elem) {elem.addEventListener ('mousedown', function (e) {log_mouseclick = "mouse clicked" + "x:" + e.clientX + "y:" + e.clientY; var svgmouse = SvgcursorPoint (E); log_mousecoord = "svg on mouse" + "x:" + svgmouse.x + "y:" + svgmouse.y; document.getElementById ('op'). InnerHTML = log_svgcursorPoint + "& lt; br & Gt; "+ log_mouseclick +" & lt; br & gt; "+ log_mousecoord;}, false);}) (L1); (Function calc_manually () {var rec = document.getElementsByTagName ("rect") [0]; var root = document.getElementsByTagName ("svg") [0]; var x = rec.getAttribute ("x"); var y = Rec.getAttribute ("y"); var CTM = root.getScreenCTM (); // How to get the information of a mouse without using events is a problem.}) ();    

Why do not you want an event? That's what they are. If you are working with mouse coordinates, stop the standard dome event listeners on your object and then when they trigger, event.target.getBoundingClientRect () function, and

Simple Display:

No comments:

Post a Comment