Setting (above/under) priority order of layer in leaflet

Question

When I add a layer in leaflet it stays automatically above all layers I want layers to be ordered wich one stays above the other in way that last added layer will not stays above and hide the other layers that may I have interaction with them (mouse :click,out,move...). here my example order layers leaflet

Answer 1

You can work with layer.bringToFront(), bringToBack() or setZIndex() to reorder your layers.

If you want one layer to always be below all others you can listen for the layer's add event and then bring it to the back (and bring the other to the front the same way):

var C300mVar1 = new L.geoJson(C300mVar1, {
  onEachFeature: function(feature, layer) {
    layer.on({
      'add': function(){
        layer.bringToBack()
      }
    })
  }
});

Demo here: http://plnkr.co/edit/6c7xxWZpv3J8oTiyjG7Q