ISSUE-136: Consider adding MouseEvent.getCoordsAt(element)

getCoordsAt

Consider adding MouseEvent.getCoordsAt(element)

State:

CLOSED

Product:

HISTORICAL: DOM3 Events [All Bugs and Issues use Bugzilla: http://tinyurl.com/Bugs-DOM3Events]

Raised by:

Doug Schepers

Opened on:

2010-10-06

Description:

Jonathan Watt <http://lists.w3.org/Archives/Public/www-dom/2010OctDec/0013.html>:
[[
Background:

Positioning elements based off the position of a pointer event is regularly
tripping people up in SVG, and with the advent of CSS-transforms, I imagine also
in HTML.

To position an element based off the position of a pointer event you need to get
the coordinates of the event in the local coordinate system of the element. To
do that currently authors have to get the *correct* element-to-root transform,
invert it, create an SVGPoint, copy the event coordinates to the SVGPoint, then
use the inverted transform to transform the point and read back the coordinates.
For something so simple, it's not obvious that this is what you need to do, or
even how to do it.

Proposal:

To make life easier for authors I'd like to propose the addition of a
'getCoordsAt' method to the MouseEvent interface. This method would be passed
the element at which the local coordinates of the event are required, and return
an object implementing the SVGPoint interface[1] (or a new interface
implementing 'x' and 'y' properties).

I've uploaded a JavaScript implemented demo of this method here:

http://jwatt.org/svg/tmp/mouse-relative-positioning.svg

See also the comments in the source code.
]]

[[
// This is a demonstration of getCoordsAt() - a proposed addition to the DOM
// interface 'MouseEvent' - that would save authors from having to work with
// matrices when positioning elements based on the location of a pointer event.
//
// This file demonstrates getCoordsAt for SVG only, but it would be just as
// useful in HTML, especially with the advent of CSS-transforms.

// JavaScript implementation of getCoordsAt for SVG:

if (!MouseEvent.prototype.getCoordsAt) {
MouseEvent.prototype.getCoordsAt = function(element) {
var SVGNS = 'http://www.w3.org/2000/svg';
var svg = document.createElementNS(SVGNS, 'svg');
var pt = svg.createSVGPoint();
pt.x = this.clientX;
pt.y = this.clientY;
return pt.matrixTransform(element.getScreenCTM().inverse());
}
}
]]

Related Actions Items:

No related actions

Related emails:

1. Re: ISSUE-136 (getCoordsAt): Consider adding MouseEvent.getCoordsAt(element) (from smfr@me.com on 2011-04-08)
2. Re: ISSUE-136 (getCoordsAt): Consider adding MouseEvent.getCoordsAt(element) (from jrossi@microsoft.com on 2011-04-08)
3. Re: Agenda: DOM3 Events Telcon, 12 October 2010 (from schepers@w3.org on 2010-10-13)
4. Re: Agenda: DOM3 Events Telcon, 12 October 2010 (from schepers@w3.org on 2010-10-12)
5. Agenda: DOM3 Events Telcon, 21 April 2010 (from schepers@w3.org on 2010-10-12)
6. ISSUE-136 (getCoordsAt): Consider adding MouseEvent.getCoordsAt(element) (from sysbot+tracker@w3.org on 2010-10-06)
7. Re: [DOM Level 3 Events] MouseEvent.getCoordsAt(element) [ISSUE-136] (from schepers@w3.org on 2010-10-05)

Related notes:

Display change log