/ / Wie man verschiedene Farbmarker im Cluster anfertigt - Javascript, Prospekt, Mapbox

Wie man verschiedene Farbmarker im Cluster erstellt - Javascript, Faltblatt, Mapbox

Ich folge dem Marker-Cluster-Beispiel in einem Flugblatt, das unten aufgeführt ist: Marker-Cluster Wie gezeigt, sind alle Marker gebündelt und jetzt möchte ich die Farbe der Marker für einige ändern. Ich werde also eine weitere Spalte in der Datei haben:

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],
]

Dabei sind 0 blaue Markierungen und rote 1 rote Markierungen. Wie kann ich also die Farbe der Markierung in Abhängigkeit von der dritten Spalte im Marker-Cluster ändern? Aktualisieren

Ich habe den folgenden Code hinzugefügt

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);

Dennoch ist die Markerfarbe blau und hat sich nicht in grün geändert. Jede Hilfe wird geschätzt

Antworten:

2 für die Antwort № 1

Eigentlich war das der Trick:

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);

Ich hoffe es hilft jedem