2017-05-08 42 views
0

我下面在单张标记集群例子低于: marker-cluster 如图所示的所有标记都聚集,现在我想修改标记一些的颜色。所以我会在文件中有另一列如下:如何使不同的颜色标记集群

var addressPoints = [ 
[-37.8210922667, 175.2209316333, "2",0], 
[-37.8210819833, 175.2213903167, "3",1], 
[-37.8210881833, 175.2215004833, "3A",1], 
[-37.8211946833, 175.2213655333, "1",0], 
[-37.8209458667, 175.2214051333, "5",0], 
[-37.8208292333, 175.2214374833, "7",1], 
] 

其中0是蓝色标记,红色1是红色标记。那么,如何根据标记组中的第三列更改标记的颜色? 更新

添加以下代码

var map = L.map('map', {center: latlng, zoom: 13, layers: [tiles]}); 
var greenIcon = new L.Icon({ 
    iconUrl: '/img/marker-icon-2x-green.png', 
    shadowUrl: '/img/marker-shadow.png', 
    iconSize: [25, 41], 
    iconAnchor: [12, 41], 
    popupAnchor: [1, -34], 
    shadowSize: [41, 41] 
}); 



     var markers = L.markerClusterGroup(); 

     for (var i = 0; i < addressPoints.length; i++) { 
      var a = addressPoints[i]; 
      var title = a[2]; 
if(a[3]==0){ 

var marker = L.marker(new L.LatLng(a[0], a[1]), { title: title },{icon: greenIcon}); 
} 
else{ 

var marker = L.marker(new L.LatLng(a[0], a[1]), { title: title }); 

} 

      marker.bindPopup(title); 
      markers.addLayer(marker); 
     } 
     map.addLayer(markers); 

但仍然标记的颜色是蓝色,并没有改变green.Any帮助表示赞赏

+0

如果我不是worng上面的问题是关于标记集群的颜色,其中我的问题不在标记集群的颜色,但个别标记本身。纠正我,如果我错了? – Ricky

+1

嗨,不,我认为你是对的。这是一个关于更新标记的好帖子,应该将其应用于群集中的标记或不适用:http://stackoverflow.com/questions/7095574/google-maps-api-3-custom-marker-color-for-default-点标记 –

+0

我更新了我的问题,我跟着这[教程](https://github.com/pointhi/leaflet-color-markers)但没有按预期工作,你能帮忙吗? – Ricky

回答

2

其实本作的伎俩:

var map = L.mapbox.map('map', 'mapbox.streets') 
     .setView([-37.82, 175.215], 14); 

    var markers = new L.MarkerClusterGroup(); 

    for (var i = 0; i < addressPoints.length; i++) { 
     var a = addressPoints[i]; 
     var title = a[2]; 

     if(a[3]==1){ 
var marker = L.marker(new L.LatLng(a[0], a[1]), { 
      icon: L.mapbox.marker.icon({'marker-symbol': 'car', 'marker-color': '#00FFFF'}), 
      title: title 
     }); 
     } 
     else{ 
      var marker = L.marker(new L.LatLng(a[0], a[1]), { 
      icon: L.mapbox.marker.icon({'marker-symbol': 'car', 'marker-color': '#ff0000'}), 
      title: title 
     }); 
     } 

     marker.bindPopup(title); 
     markers.addLayer(marker); 
    } 



    map.addLayer(markers); 

希望它可以帮助任何人