Finding SVG Coordinates of Embedded HTML Content

I have an SVG file with embedded HTML content (table and form elements). I want to create some SVG elements that exactly touch portions of the table[1], e.g. a border between two rows. As such, I need to know the coordinates in SVG space of some of my HTML elements.

My best idea so far on how to accomplish this has been to use getBoundingClientRect() to find the screen space coordinates of the elements, and then transform this screen space point back into the coordinates for some SVG element. I have an example[2] of this code that works in Chrome/Safari, though it is relying on apparently broken behavior[3] in those browsers. (I hope to find or file a Webkit bug about this presently.)

My question: is there a better way to accomplish my goal of getting SVG elements coordinated with embedded HTML elements?

[1] http://phrogz.net/tmp/BubbleControl-rough.png
[2] http://phrogz.net/svg/html_location_in_svg.svg
[3] http://stackoverflow.com/questions/8044338

Received on Tuesday, 8 November 2011 12:23:53 UTC