2

I'm using Leaflet MarkerCluster. I created a MarkerClusterGroup as markers1 as you can see. There's about a hundred points I have written like var addressPoints in this format:

   var addressPoints = [
    [40.747344,-73.994985, "***", "***", "University", "***", "***", "***"],    

This is my code:

var markers1 = new L.MarkerClusterGroup( { showCoverageOnHover: false } );


        ......
    for (var i = 0; i < addressPoints.length; i++) {
        var a = addressPoints[i];
        var title = a[2];
        var direct = a[3];
        var univ = a[4];
        var city = a[5];
        var state = a[6];
        var country = a[7];
var marker = new L.Marker(new L.LatLng(a[0], a[1]), { icon: myIcon } );

        ......

marker.bindPopup(list);

I need to put three different icons for markers for each "University" category (3 categories). That is var univ = a[4] in this list. I don't want to change those nice green circles when markers are clustered, but those icons for standalone markers when we're using big zoom. Is there some way to do that?

5

You can create three different icon-objects, outside loop, using L.Icon. E.g: iconA, iconB and iconC. Then, inside loop, switch icon according to univ-category.

var myIcon;
switch(univ) {
  case "cat1":
    myIcon = iconA;
  break;
case "cat2":
    myIcon = iconB;
break;
case "cat3":
    myIcon = iconC;
break;
default:
    myIcon = iconX;
}
//Then create the marker
var marker = new L.Marker(new L.LatLng(a[0], a[1]), { icon: myIcon } );

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.