Openlayers 4 - 使图层在功能点击时不可见

Question

我有一张包含 2 个 layer 的地图，其中包含 features（标记）。我已经这样做了，如果地图放大得足够远，1 layer 将变得不可见，另一个将变得可见（反之亦然）。像这样：

this.map.getView().on('propertychange', (e: any) => {
  if (e.key == "resolution") {
    if (this.map.getView().getZoom() >= 17) {
      exampleLayer1.setVisible (false);
      exampleLayer2.setVisible (true);
    } else if(this.map.getView().getZoom() < 17) {
      exampleLayer2.setVisible (false);
      exampleLayer1.setVisible (true);
    }
  }
})

我现在需要补充的是，如果您点击 exampleLayer1 图层中的 feature，地图将放大并以该要素的位置为中心，这将使exampleLayer1 消失，exampleLayer2 可见。为此，我使用这个函数：

var select_interaction = new ol.interaction.Select();

select_interaction.getFeatures().on("add", (e: any) => {
  var feature = e.element;
  this.map.getView().setCenter(feature.getGeometry().getCoordinates())
  this.map.getView().setZoom(17);
});

this.map.addInteraction(select_interaction);

几乎一切正常，这意味着一个 layer 会消失，另一个会出现。但是，单击的 feature 不会消失，即使它的父项（layer）确实消失了。如果我然后单击远离 feature 它将消失。

如何让layer（包括点击的feature）在点击feature时不可见？

Answer 1

ol.interaction.Select 个所选功能已添加到内部非托管层。

这就是为什么即使底层不可见，所选要素也可见的原因。

您可以在使用 select_interaction.getFeatures().clear()（就像点击离开）放大时取消选择所选要素。

我还建议您使用层的 min/maxResolutions（参见 http://openlayers.org/en/latest/apidoc/ol.layer.Base.html）来切换层的可见性。

Openlayers 4 - 使图层在功能点击时不可见

Openlayers 4 - Make layer invisible on feature click

javascript

openlayers

typescript