How do I change the marker color in a leaflet cluster?

user_15634265 0
Viewed 1731

I am using openstreetmap and lealfet. I want to change the color of the marker in the cluster. That is, there is an array of coordinates.

var addressPoints = [ [62.26763, 74.47733, "CAR", 1], ];

I would like the marker color to change "1" supposedly green, and "0" blue. I also found a similar question here, where I used the answer in the form.

But the map breaks down. What does this fragment describe? That is, what is its use.

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

I would really appreciate a hint.

leaflet marker maps css javascript
2 Answers

This

        var tiles = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                maxZoom: 18,
                attribution: '&copy; <a href="https://www.openstreetmap.org/copyright"></a>'
            }),
            latlng = L.latLng(63.63, 100.55);

        var map = L.map('map', {center: latlng, zoom: 3, layers: [tiles]});

        var markers = 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.map.marker.icon({'marker-symbol': 'car', 'marker-color': '#00FFFF'}),title: title});
        }
        else{
        
            var marker = L.marker(new L.LatLng(a[0], a[1]), {icon: L.map.marker.icon({'marker-symbol': 'car', 'marker-color': '#ff0000'}),title: title});
        }
            marker.bindPopup(title);
            markers.addLayer(marker);
        }

        map.addLayer(markers);
user_156342650

Using Css

img.leaflet-marker-icon {
  filter: hue-rotate(244deg);
}
user_15812930
Related