전단지 : 레이어 내에 GeoJSON 요소를 주문하십시오.

pointToLayer 기능을 사용하여 리플릿을 사용하여 GeoJSON 레이어를 표시하고 있습니다. 지금까지는 모든 것이 정상적으로 작동합니다.전단지 : 레이어 내에 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이 팝업에서 읽을 수있는 것을 알 수 있으며, 확인을 찾습니다

내가 여기에 많은 일을했지만, 한 내가 최선 시도는 생각입니다. 그러나 원의 표시 순서는 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 데이터를 리플릿 레이어로 변환하는 한 GeoJSON 기능 데이터를 각'circleMarker.feature' 멤버에 자동으로 추가해야합니다. 문제가 생기면 언제든지 새로운 질문을 열어보십시오. 주문과 관련하여 해당 게시물에도 관심이있을 수 있습니다. https://gis.stackexchange.com/questions/166252/geojson-layer-order-in-leaflet-0-7-5/167904#167904 – ghybs

미안하지만 당신의 대답은 나에게 그것이 작동하게 할 수없는 약간의 힌트를 준다. 예를 들어 주시겠습니까, 아니면 jsfiddle을 주시겠습니까? 그게 좋을거야! –

ghybs 1.0 리플릿로 전환, 완벽 전단지 0.7에 대한 작품에 대답 반면이 쉬운 솔루션을 만드는 창을 사용할 수 있습니다 :

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

전단지 : 레이어 내에 GeoJSON 요소를 주문하십시오.

답변

관련 문제