How to locate the mouse pointer in SVG?

Question

I would like to know how I can use JavaScript to find out the location of the mouse pointer when it is within the bounds of an SVG viewBox. Do I need to use the event model to keep track of all the various mouse motion events, or is there a way I can poll the mouse pointer to have it tell me where it is when I need it?

Answer 1

You can hook to the onmousemove event and access the event object:

function on_mouse_move(evt) {
  var
    x = evt.clientX,
    y = evt.clientY;
}

(This assumes on_mouse_move is connected to the onmousemove event of your SVG document).