Multiple Select - Part II?

[Bishop, Michael W. CONTR J9C880]

Much earlier on this mailing list, I asked how to do a multiple select
on the JSVGCanvas.  You draw a rectangle and every element that
intersects the rectangle is selected.  Using
SVGDocument.getRootElement().getIntersectionList(...) works well, but I
do have one bug I'm trying to solve.

 

Imagine the case where you have a box that's 20x20.  On top of that box
(Z order), you have another 10x10 box.  If you drag the selection box
inside the 10x10 box, the 20x20 box is also selected.  In other words,
the Z order is not taken into account.  Using strictly X and Y, the
selection box does intersect both boxes.

 

The case below illustrates the problem; drawing a selection box in the
blue box also selects the red box.  Is there a way to avoid this?  I
don't want the selection to automatically "drill down", I just want to
grab what I see the selection box touch.

 

Michael Bishop

 

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20001102//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd";>

 

<svg contentScriptType="text/ecmascript" zoomAndPan="magnify"

     xmlns:xlink="http://www.w3.org/1999/xlink";
contentStyleType="text/css"

     id="SVGWB-1A2A34FE-D237-E0DD-7F8E-9D0349103E27" version="1.0"
width="640"

     fill="none" preserveAspectRatio="xMidYMid meet" viewBox="0 0 640
480"

     height="480" xmlns="http://www.w3.org/2000/svg";

     xmlns:svgx="http://je.jfcom.mil/svgx";>

    <rect x="-1000%" y="-1000%" fill="white" width="3000%"

          id="SVGWB-116547D7-7F36-2E68-5B72-7E5CCDD02B1D" height="3000%"

          svgx:type="background"/>

    <g svgx:name="default_layer" svgx:type="layer"

       id="SVGWB-9DC7D3C3-A11C-6F0B-B47E-231D2C1ABD7F" style="display:
block"

       pointer-events="none">

        <rect x="98" y="93" transform="matrix(1.0, 0.0, 0.0, 1.0, 0.0,
0.0)"

              fill-opacity="1" fill="rgb(204,0,51)" width="315"
height="265"

              id="SVGWB-C318EC0D-B37C-383B-69C6-90084D76291B"
stroke="black"

              stroke-opacity="1" stroke-width="1"
pointer-events="visible"/>

        <rect x="158" y="154" transform="matrix(1.0, 0.0, 0.0, 1.0, 0.0,
0.0)"

              fill-opacity="1" fill="rgb(0,51,255)" width="196"
height="147"

              id="SVGWB-5D7335F1-3A67-5B3A-1B5A-682D2313A4C8"
stroke="black"

              stroke-opacity="1" stroke-width="1"
pointer-events="visible"/>

    </g>

</svg>