I have county polygons in GeoJSON format. Obviously, some of the counties share an edge.

When a county is hovered over, the stroke and fill change to a red color.

The problem is that the stroke of some of the polygons is covered by the one next to it.

Is there a way to reorder the features so that the feature that is hovered over moves to the top?

I've seen that there's a bringToFront method, but that is for a layer, not a feature.

Any ideas?

1 Answer 1


You should really use the bringToFront method.

In Leaflet, everything is a layer (except controls), even when it is the representation of a GeoJSON feature. In the latter case, we are even talking about vector layers.

The bringToFront and bringToBack methods are specific to vector layers, so that you can re-order them within their SVG or Canvas container (whereas raster and HTML layers can get a CSS class with z-index for that purpose).

Demo: https://jsfiddle.net/3v7hd2vx/228/

  • I made a stupid mistake. I had bringtoFront on accident, and didn't check the console! What you suggested works! Thank you.
    – geogeogeo
    Mar 23, 2017 at 19:04

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.