title: How to select which feature overlay in case of overlapping or same geometry in OpenLayers
body: <p>I created a map in which an overlay is opened clicking on the features. But I have problem if more than one feature are in overlapping, or worse, when features have the same geometry.</p>
  <p>I use this code to show the overlay. But when two features have the same geometry only one overlay is shown.</p>
  <pre><code>const overlayContainerElement = document.querySelector('.overlay-container');
  
      const overlayLayer = new ol.Overlay ({
          element: overlayContainerElement
      });
      map.addOverlay(overlayLayer);
      const overlayFeatureName = document.getElementById('feature-name');
      const overlayFeatureAdditionalinfo = document.getElementById('feature-additionalinfo');
  
  
      map.on('click', function(e){
          overlayLayer.setPosition(undefined);
          map.forEachFeatureAtPixel(e.pixel, function (feature, layer){
              let clickedCoordinate = e.coordinate;
              let clickedFeatureName = feature.get('Number')
              let clickedFeatureInfo = feature.get('Text');
              overlayLayer.setPosition(clickedCoordinate);
              overlayFeatureName.innerHTML = clickedFeatureName;
              overlayFeatureAdditionalinfo.innerHTML = clickedFeatureInfo;
          },
          {
              layerFilter: function(layerCandidate){
                  if (layerCandidate.get('title') === &quot;Title&quot;) {
                      return 1;
                  }
              }
          })
      });
  </code></pre>
  <p>Any idea how to configure a way in order to select which feature detail I want to see? So after clicking, if two features are under the mouse, a sort of list is shown to select what overlay I want to open.</p>