根据地图的缩放级别和单击次数显示多边形图层

Question

所以我有一个OpenStreetMap地图（带Leaflet），并放了一个欧洲javascript层（我在javascript中插入了ID以区分每个国家）。 当我用鼠标悬停在每个国家时，都会突出显示。 当我单击一个国家时，它会自动放大。

而且我想，当我单击国家/地区时，国家/地区的图层会消失（根据缩放级别）（但是其他国家/地区必须保持“分层”状态。）（在此之后，我将尝试将标记放在仅在国家/地区图层消失时才会显示的国家/地区上，我们可以通过单击将其放大。

附言：此刻，我关注了这个网站，以做我拥有的一切： https : //leafletjs.com/examples/choropleth/

和我的代码： https : //jsfiddle.net/Gio687351/3bwsnu8z/2/

map.on('zoomend ', function(e) {
    if (map.getZoom() < 3) {
        map.fitBounds(layer.getBounds())
        map.removeLayer(Europe-Layer.js)
        map.setStyle({
            'fillOpacity': '0.7'
        });
    } else if (map.getZoom() >= 3) {
        map.fitBounds(layer.getBounds())
        map.addLayer(statesData);
        map.setStyle({
            'fillOpacity': '0.0'
        });
    }
}); 

Answer 1

图层可见性可以通过fill-opacity和opacity 样式属性进行管理，如下所示：

function toggleLayerVisibility(map, layer) {
  if (selectedLayerId) {
    geojson.resetStyle(layer);
    selectedLayerId = null;
  } else {
    //hide a layer
    layer.setStyle({
      opacity: 0,
      fillOpacity: 0.0
    });
    selectedLayerId = layer._leaflet_id; //save identifier of a selected layer
  }
}

说明：

• 设置opacity: 0和fillOpacity: 0隐藏图层
• selectedLayerId用于存储当前选定图层的标识符

给定所提供的示例， 以下演示演示了如何隐藏单击的图层