javascript - OpenLayers 3悬停每次只突出显示一个指定的对象

Question

原始问题:

OpenLayers 3(也测试了最新的 3.14.1)在选择相互重叠的特征的方式上应该有一定的意义。当 multi=false 时，它只选择一个特征，但是随机选择。当您从不同方向将鼠标悬停在某些要素上时，会选择不同的要素。

我试图通过将 z-index 设置为 features 来告诉 Openlayers 所需的顺序来解决这个问题。索引设置为订购 point > line > polygon 但我仍然没有在悬停时首先选择点。

Z-Index 应用于图层:

rendererOptions: { zIndexing: true }

上层和

zIndex: x

不同特征类型的风格。

首先发生了什么:

Z 索引不起作用，所以我无法纠结选择的情况。我保留了 multi=true 并从列表中手动过滤了结果。

我有一个函数 getSelectedRemovableFeature(event.selected) 接受 event.selected 并且只返回其中的一个特征。

所以，我的选择有如下代码:

 var selectionInteraction = new ol.interaction.Select({
                               layers: [layersModule.getTargetLayer()],
                               condition: ol.events.condition.click,
                               multi: true
                            });  

and more..

selectionInteraction.on('select', function(event) {

                var selectedFeature = null;

                selectedFeature = getSelectedRemovableFeature(event.selected);

                if(selectedFeature){
                   .. some logic..
                   layersModule.getTargetLayer().getSource().removeFeature(selectedFeature);
                }
         });

然后我卡住了:

我有

var hoverInteraction = new ol.interaction.Select({
                       layers: [layersModule.getTargetLayer()],
                       condition: ol.events.condition.pointerMove,
                       multi: true
                       });

..和..

hoverInteraction.on('select', function(event) {

            var selectedFeature = null;

            selectedFeature = getSelectedRemovableFeature(event.selected);

            // here I didn't know what to do..
            }
     });

我有这样的逻辑:

  selectControl = new OpenLayers.Control.SelectFeature(vectorLayer);
  ...
  map.addControls([selectControl]);
 selectControl.activate();

  // unselect any specific feature...
  selectControl.unselect(vectorLayer.features[0]);

( https://gis.stackexchange.com/questions/41017/how-can-i-unselect-a-feature-in-openlayers )

.. 但是当它在那里时，没有选择被删除，它的工作方式与没有这部分一样。

回到原点:

现在我意识到，纠结于 hoverSelection 数据是没有用的，因为在我可以计算如何选择一个之前，新的 multi=true 类型事件被抛出仅并表明这一点。我相信是这样，因为即使我手动过滤结果并删除功能也没有任何改变。

最后简而言之:

如何确定悬停/选择选择的明确顺序？

Answer 1

map 上特征的命中检测以相反的渲染顺序工作。默认情况下，点最后渲染，所以它们首先被检测到(并被选中)。当任何样式都没有设置zIndex时，渲染顺序是多边形、线、点、文本。

当你在 ol.style.Style 上设置 zIndex 时，你覆盖了这个固定的渲染顺序，允许你，例如在点之上渲染多边形。

在这四个组(多边形、线、点、文本)中，您可以通过在 ol.layer.Vector 上设置一个 renderOrder 函数来控制渲染顺序。这是一个数组排序函数，调用时具有两个特征:

new ol.layer.Vector({
  renderOrder: function(a, b) {
    if (a.get('importance') < b.get('importance')) {
      return -1;
    } else if (b.get('importance') > a.get('importance')) {
      return 1;
    }
    return 0;
  }
});

以上假定您的功能具有数字“重要性”属性。现在，当您点击检测(选择)相同几何类型(例如点)的特征时，将首先选择“重要性”值较高的特征，因为它们是最后呈现的。

另请注意，没有像您在问题中所述的rendererOptions。