[GIS] Leaflet geoJson in front of markers in a FeatureGroup

geojsonleaflet

I am loading some markers and json data to a leaflet map.

I need to get my json in front of the markers. I have tried placing the markers and json in seperate FeatureGroups and then tried bringToFront() and bringToBack() to no avail

var markerHolder = new L.FeatureGroup().addTo(map).bringToBack();
var jsonHolder = new L.FeatureGroup().addTo(map).bringToFront();

I also tried using this panes work around but when using a Feature group in place of the tileLayer as in the example below, an error was thrown at getContainer()

var topPane = map._createPane('leaflet-top-pane', map.getPanes().mapPane);
    var topLayer = L.mapbox.tileLayer('lxbarth.map-vtt23b1i').addTo(map);
    topPane.appendChild(topLayer.getContainer());
    topLayer.setZIndex(9);

Here is a fiddle illustrating my problem – could anyone demonstrate how to get my json features in front of the markers?

Best Answer

The only thing I suggest is using something other than markers for the layer that is to go on the bottom.

Try using a circle or point layer instead of a marker layer. That should work.

I reckon markers are designed to always be on top.

Related Question