Selection and Popups on Overlapping/Coincident Vector Layer Polygons in OpenLayers

Question

I have a GeoJSON file of polygons that I am bringing into my OpenLayers session. Some of the polygons occupy the same space on the map. I am using a select control and popup control like:-

selectControl = new OpenLayers.Control.SelectFeature(geojson_layer,
{
    onSelect: onFeatureSelect, onUnselect: onFeatureUnselect,
    clickout: true, toggle: true,
    multiple: false, hover: false,
    toggleKey: "ctrlKey", // ctrl key removes from selection
    multipleKey: "shiftKey" // shift key adds to selection
});
map.addControl(selectControl);
selectControl.activate();
geojson_layer.events.on(
{
    "featureselected": function(e) 
    {
        showStatus("selected feature "+e.feature.attributes.APPREF+" on  Applications");
    },
    "featureunselected": function(e) 
        {
        showStatus("");
        }
    });   
        function onFeatureSelect(feature) 
        {
            selectedFeature = feature;
            popup = new OpenLayers.Popup.AnchoredBubble
            (   
                "chicken", 
                feature.geometry.getBounds().getCenterLonLat(),
                null,
                "<div style='font-size:.8em'><b>App Reference: </b>" + feature.attributes.APPREF +"<br><b>Proposal: </b><br>" + feature.attributes.PROPOSAL+ '<br><a href="localhost:8080/ApplicationDetail.aspx?Ref='+feature.attributes.APPREF+'" target="_blank">Further Details</a>'+"</div>",
                null, 
                true, 
                onPopupClose
            );
            feature.popup = popup;
            popup.autoSize = true;
            popup.minSize = new OpenLayers.Size(150,50);
            popup.maxSize = new OpenLayers.Size(250,150);
            //popup.panMapIfOutOfView = true;
            popup.closeOnMove = true;
            map.addPopup(popup);
        }
        function onFeatureUnselect(feature) 
        {
            map.removePopup(feature.popup);
            feature.popup.destroy();
            feature.popup = null;
        }

Where more than 1 polygon occupies the same space - can anyone advise how I allow for drilling down and/or making the other features at the location available for a popup (and therefore the link out for further information).

I suspect the answer lies somewhere in Z-indexing, but can't wrap my head around how I would integrate that from the example thats provided.

Presumably there is a way of handling this type of scenario - if someone could enlighten me that would be very much appreciated

Thanks

Answer 1

This is not possible with stock OpenLayers. But there is a pull request with an alternative to the SelectFeature control, which applies to both OpenLayers 2.12 and current master. Using events, that FeatureAgent should notify you of all features that you hit with a click.

Minor caveat: when your features are rendered with the Canvas renderer, only the topmost feature will be hit - like with the SelectFeature control. But with SVG and VML renderers you will be fine.