Selecting SVG elements where the selection box completely engulfs object

Question

As it currently stands SVG-edit 2.6:

The select tool selects objects when the selection box intersects with an objects b.box(Bounding Box).

I think this is wrong UX.

The select tool should only select objects that either:

- Engulf the whole object - OR - Intersect with the actual object

I am lost in the 1000's of LOC of the whole app. Anyone with an idea where i can fiddle with the code to make it work and/or any possible ideas of how to achieve any of my above proposals?

Answer 1

in order to select element when selection box 'Engulf the whole object ' , you can try this:-

1) While making selection box, check whether all four corners of element lies inside selection box or not. you can get four points of element using getBBox(). such as:-

var bbox=element.getBBox();
var x=bbox.x;
var y=bbox.y;
var width=bbox.width;
var height=bbox.height;

var point1={
x:x,
y:y
};

var point2={
x:x+width,
y:y
};

var point3={
x:x+width,
y:y+height
};

var point4={
x:x,
y:y+height
};

Now compare all points with selection rect, if all are inside selection rect, then make element selected.

2) Now about 'actual object'. i think you mean actual shape of element, not with BBox. for that, one solution would be to convert your shape to 'path' and then get all 'nodes' of path. and lastly compare all these nodes (points) with selection rect one by one.

to get points in a path, try this function:-

 function path2Array(path) {

                        var pointsArray = new Array();
                        for (var i = 0; i < path.getTotalLength(); i++) {
                                var point = path.getPointAtLength(i);
                                var cordinatesXY = {
                                        x: point.x,
                                        y: point.y
                                }    
                                pointsArray.push(cordinatesXY);
                        } 
                        return pointsArray;
                }

;

(thats what i came up with). :-)