2017-05-08 37 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); 

希望它可以幫助任何人