[GIS] Highlighting selected geojson feature and return to previous state when another one is selected using Leaflet

featuresgeojsonleafletmarkers

I've a map with a geojson layer containing markers, polygons and lines.

I made a module so that when a feature is clicked, its properties are displayed in a frame and not in standard Leaflet popup. It works perfectly well and I'm quite happy with it.

Point is that I'd like to have the selected feature to highlight when clicked and return to unselected state when another one is clicked.

Do you have an idea on how I can achieve that ?

Best Answer

It's easy have two styles, I had a green for my stateLayer and created a Highlight layer, then in the onEachFeature function create a layer on-click function. 

        layer.on("click", function (e) { 
            stateLayer.setStyle(style); //resets layer colors
            layer.setStyle(highlight);  //highlights selected.
        });

working example, right click view source. http://www.gistechsolutions.com/leaflet/DEMO/basic/basic_Poly.html

Related Question