2016-07-13 1 views
2

지도에 여러 마커가 있습니다. 다른 색상의지도 안의 영역에 색상을 지정하고 싶습니다. 나는 L.multiPolygon, L.polygon, L.rectangle을 시도했지만 아무것도 원하지 않는다. 내 유일한 옵션은 모든 마커의 경계를 계산하고 이러한 점을 기반으로 다각형을 그리는 것입니다. 맞습니까? 여기leafletj의 L. 폴리곤 바운딩

코드

<c:forEach var="marker" items="${markers}" varStatus="rowIndex"> 
     var marker${rowIndex.index} = L.marker([${marker.lat},${marker.lng}],{icon: yellowIcon,title: '${marker.title}'}).addTo(mymap) 
     .bindPopup("${marker.HTMLMarkerPopupCode}").openPopup(); 
     storeCoordinate(${marker.lat}, ${marker.lng}, polygonPoints); 
</c:forEach> 

var polygon = L.polygon(polygonPoints); 

polygon.setStyle({fillColor: '#0000FF'}); 
polygon.setStyle({color: 'red'}); 
polygon.setStyle({weight:1}); 
polygon.setStyle({fillOpacity: 0.5}); 
mymap.addLayer(polygon); 

enter image description here

나는이 그림과 비슷한 달성하고 싶습니다 :

enter image description here

답변

0

당신은뿐만 아니라 L.Polygon를 사용할 수 있습니다.

그냥 같은 것을 할 :

var polygon = L.polygon([ 
    marker1, 
    marker2, 
    marker3, 
], { 
    fillColor: '#f03' // My custom color here 
} 
).addTo(mymap); 
0

회원님이 달성하려고 정확히 무엇인지?

마커 영역의 Convex Hull을 계산하는 데 관심이있을 수 있습니다.

그런 경우 인터넷에서 일부 JavaScript 구현을 찾을 수 있어야합니다. 예를 들어, 당신은이 Leaflet.markercluster 플러그인에서 수행하는 방법을 볼 수 있습니다 : https://github.com/Leaflet/Leaflet.markercluster/blob/master/src/MarkerCluster.QuickHull.js


편집 : 볼록 선체를 만드는으로

은 또한 특정 turf.convex에, Turf을 사용할 수 있습니다.

터프는 turf.concave을 비롯한 많은 다른 기능을 제공합니다.