Question

I'm currently using a png as markers but I would like to change the one that get clicked on & active to a different png.

How do I achieve that?

        var icon = [
            {   
                "className": "my-icon icon-dc", // class name to style
                "html": '<img class="style-svg" src="wp-content/uploads/2016/06/circle.svg" alt="">', // add content inside the marker
                "iconSize": [60,60] // size of icon, use null to set the size in CSS
            }
        ];

     myLayer.on('layeradd', function(e) {
        var marker = e.layer,
            feature = e.layer.feature;

        marker.setIcon(L.divIcon(feature.properties.icon));
     });


        // Listen for individual marker clicks.
    myLayer.on('click',function(e) {
        // Force the popup closed.
        e.layer.closePopup();

        var feature = e.layer.feature;
        var content = '<div><div id="close1" class="absolute_p"><img class="exit" src="/wp-content/uploads/2016/06/X@2x.png"></div>' +
                      '<img src="' + feature.properties.img + '" alt="">' +
                      '<h4>' + feature.properties.title + '</h4>'  +
                      '<p>' + feature.properties.description + '</p>' +
                      '<p class="num">' + feature.properties.num + 'Properties now showing</p>' +
                      '<a href="'+ feature.properties.url +'" class="btn btn-default btn-lg absolute_p" target="_blank">find your second home here</a></div>';

        info.innerHTML = content;
        map.panTo(e.layer.getLatLng());

    });

Answer 1

在click事件处理结束时，为什么不在setIcon上使用e.layer并引用＆＃34;有效＆＃34; /＆＃34;点击＆＃34;你在其他地方宣布的图标？

var myNewIcon = L.icon({
    iconUrl: 'my-new-icon.png'
});

e.layer.setIcon(myNewIcon)

http://leafletjs.com/reference.html#icon

Change Mapbox marker image on click

1 个答案: