javascript - 指定 geoJSON 图层属性的传单设置缩放级别

Question

我想为传单中的某些指定 geoJSON 属性层设置单独的缩放级别。

我使用了以下代码(根据此过程的延续): Setting zoom level for layers in leaflet

   map.on('zoomend', function() {
   if (map.getZoom() <6){
        map.removeLayer(mylayer);
     }else{
    map.addLayer(mylayer);
    }
  });

哪个适用于 geoJSON 层？当缩放比例低于 6 时，图层消失。

我想对这个 GeoJSON 层中包含的一些 feature.property 做同样的事情。

然后我尝试了这样的事情:

  map.on('zoomend', function() {
      if (map.getZoom() <8){
        map.removeLayer(feature.properties.Capacity>=40);
       }else{
        map.addLayer(feature.properties.Capacity>=40);
        }
       });

但不幸的是，结果很糟糕。当上下翻转缩放级别时，我的所有点都在 map 上 float ，而不是工作功能。

控制台状态:

Uncaught ReferenceError: feature is not defined at i. ((index):173) at i.fire (leaflet.js:5) at i._moveEnd (leaflet.js:5) at i. (leaflet.js:5) (anonymous) @ (index):173 fire @ leaflet.js:5 _moveEnd @ leaflet.js:5 (anonymous) @ leaflet.js:5 requestAnimationFrame (async) M @ leaflet.js:5 _onZoomTransitionEnd @ leaflet.js:5 setTimeout (async) _animateZoom @ leaflet.js:5 (anonymous) @ leaflet.js:5 requestAnimationFrame (async) M @ leaflet.js:5 _tryAnimatedZoom @ leaflet.js:5 setView @ leaflet.js:5 setZoomAround @ leaflet.js:5 _performZoom @ leaflet.js:5 setTimeout (async) _onWheelScroll @ leaflet.js:5 s @ leaflet.js:5 2

我不太明白，因为 geoJSON 层已被提取到 map 中。

你能帮我解决这个问题吗？

我正在寻找的东西很接近:

https://gis.stackexchange.com/questions/41928/adding-removing-leaflet-geojson-layers

https://gis.stackexchange.com/questions/239795/leaflet-remove-filtered-layer

这让我进行了第三次尝试，不幸的是没有成功

  map.on('zoomend', function() {
     if (map.getZoom() <6){
    if (feature.properties.Capacity >=40){
        map.removeLayer(feature.properties.Capacity);
     }else{
     map.addLayer(feature.properties.Capacity);
     }
   });

您可以在此链接下看到我的另一个尝试: https://gis.stackexchange.com/questions/341684/leaflet-setting-zoom-level-for-a-specified-geojson-layer-feature

Answer 1

看起来动画有问题，只需将 zoomanimation 设置为零即可。

https://leafletjs.com/reference-1.6.0.html#map-zoomanimation