Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Hit-testing SVG shapes?

The browsers which have implemented parts of the SVG spec (Firefox etc) do hit-testing for us for free - if I attach a mousedown listener on an SVG object, I get notified whenever the shape is clicked. This is amazing, especially for complex polygon shapes.

I'm wondering if there's a way I can utilize this feature for a bit more hit testing. I want to know if a given rectangle intersects any of my SVG shapes.

For example, I add 3 complex polygons to my element. Now I want to know if rectangle (40, 40, 100, 100) intersects any of them. Does anyone have an idea how I could possibly hook into the already great hit-testing support available, instead of adding all this code myself?

Thanks

like image 970
user246114 Avatar asked Feb 01 '10 04:02

user246114


1 Answers

The SVG 1.1 DOM has just the right method (unfortunately it's not yet implemented in mozilla):

var nodelist = svgroot.getIntersectionList(hitrect, null); 

For a full working example see here.

like image 78
Erik Dahlström Avatar answered Sep 22 '22 06:09

Erik Dahlström