Leaflet：订购图层中的GeoJSON元素

我正在使用leaflet和pointToLayer函数显示GeoJSON图层。目前一切正常。Leaflet：订购图层中的GeoJSON元素

但我想根据GeoJSON的属性以特定顺序显示我的观点。这很重要，因为我的点的半径随着这个属性而变化，我需要在顶部显示较小的圆圈。我希望我明确自己。

我试过很多东西，但这里是我觉得是我最好的尝试：

var pointLayer = L.geoJson(centroids, { 
       pointToLayer: function (feature, latlng) { 
        return L.circleMarker(latlng, { 
         fillColor: "#76C551", 
         color: "#000", 
         weight: 1, 
         fillOpacity: 1 
        }); 
       }, 
       onEachFeature: function (feature, layer) { 
        var radius = calcPropRadius(feature.properties.nb); 
        layer.setRadius(radius); 
        feature.zIndexOffset = 1/feature.properties.nb*1000; 
        layer.bindPopup(feature.properties.name + " : " + String(feature.zIndexOffset)); 
       } 
      });

你可以注意到的特点zIndexOffset可以在弹出窗口中读取，并且他们看起来OK。但圆圈的显示顺序并不反映zIndexOffset。我试过使用setZIndexOffset方法，但据我所知，它只适用于标记。

有谁知道如何做到这一点？非常感谢任何见解！

来源

2016-08-23 J. Pierson

如你所想，zIndexOffset选项只适用于L.marker的。

L.circleMarker进入overlayPane，您可以使用.bringToFront()和.bringToBack()方法将它们重新排序。

来源

2016-08-23 14:29:26 ghybs

谢谢！但是，是否可以访问我想用于在覆盖窗格中排列标记的属性？据我所见，圆圈标记不保留GeoJSON属性，但我可能是错的！ –

只要使用'L.geoJson（）'将GeoJSON数据转换为Leaflet图层，它就会自动将GeoJSON特征数据添加到每个'circleMarker.feature'成员中。如果您遇到麻烦，请随时打开一个新问题。至于订购，你可能也有兴趣在这篇文章：https://gis.stackexchange.com/questions/166252/geojson-layer-order-in-leaflet-0-7-5/167904#167904 – ghybs

我是对不起，但事件虽然你的答案给了我一些提示，我不能让它工作。你可以举个例子，或者一个jsfiddle吗？那太好了！ –

而ghybs回答完美的单张0.7工作，切换到单张1.0允许使用的窗格，这使得一个简单的解决方案：

var pointLayer = L.geoJson(centroids, { 
      pointToLayer: function (feature, latlng) { 
       return L.circleMarker(latlng, { 
        fillColor: "#76C551", 
        color: "#000", 
        weight: 1, 
        fillOpacity: 1 
       }); 
      }, 
      onEachFeature: function (feature, layer) { 
       var radius = calcPropRadius(feature.properties.nb); 
       layer.setRadius(radius); 
       layer.setStyle({pane: 'pane'+ feature.properties.nb}); 
       var currentPane = map.createPane('pane' + feature.properties.nb); 
       currentPane.style.zIndex = Math.round(1/feature.properties.nb*10000); 
       layer.bindPopup(feature.properties.name + " : " + String(feature.zIndexOffset)); 
      } 
     });

希望它可以使用别人！

来源

2016-09-06 15:12:36

Leaflet：订购图层中的GeoJSON元素

回答

相关问题