If users create a polygon feature that completely overlaps another one, like this …

… then there's no way you can select the inner feature, i.e. the one that's overlapped by the other. I'm currently using a simple SelectFeature like this:

var select = new OpenLayers.Control.SelectFeature(
  [this.annotationLayer, this.controlPointsLayer], { 
    hover: true,
    renderIntent: "temporary"

But obviously, I can only get it to select the outer feature. What is the typical way of dealing with this? How can I make it possible for the user to select the inner feature as well?

The simplest solution would probably be to make the outer feature only selectable within the area that's left when subtracting the inner feature – but I have no idea how to go about doing that.

  • 1
    You need to create a z-index (Ordering) - see openlayers.org/dev/examples/ordering.html
    – Mapperz
    Jul 10 '12 at 14:34
  • Phew, so that means I'd have to manually check every possible combination of features for overlaps and assign a custom z-order before loading them? Like… having a function that determines whether one feature is completely contained within another one?
    – slhck
    Jul 10 '12 at 15:01
  • z-index ordering does not work
    – neogeomat
    Apr 9 '13 at 10:22

Few options. Some crazier :-) than others. The basic strategies are

  • Cluster features
  • Hide/move the top feature
  • Send the click through the top feature


  1. Turn on feature clustering strategy

  2. Implement your own clustering algorithm, so when a new item is added or modified, your algorithm re-runs and does a nested for-loop check and n*n(-1) checks to see what overlaps with what - then modify the feature property to setup a list of overlapping features, and when the user Clicks on the feature, display a list of features that overlap and have user select what they really wanted to click on. Makes sense?

  3. Instead of implementing feature on-click, just implement a whole map click handler. And when user clicks, check through your layer for any intersecting features - and if there is one - display that guy's pop-up, and if there are multiple, display a prompt list like in #2 above. If none intersect, just ignore.

  4. Implement a right-click option to temporarily "hide" a feature to let you get access to the hidden feature. As soon as next one is clicked, re-display all the hidden features

  5. Similar to #4, inside the top feature's pop-up, add a menu/link item to "hide" the feature. And proceed like in #4.

  6. Similar-ish to #4/5 implement a right-click "temporary move" and click drag the feature out of the way [remember it's old spot]. Then user clicks lower feature and the top one springs back to it's original position.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.