Layer order in `L.Control.Layers` is not preserved with GeoJson/FeatureGroup

When I do

L.control.layers({
    'OSM': L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map)
}, {
    'Circle': L.circle([53, 4], 111111),
    'Polygon': L.polygon([[48, -3], [50, -4], [52, 4]]),
    'GeoJSON': L.geoJson(geojson)
}, {
    collapsed: false
}).addTo(map);

I expect the order of the overlays to be as I supplied them, however, GeoJSON and FeatureGroup layers are moved up top. This is because the FeatureGroup gets its _leaflet_id while it’s created, while the other layers get it while they’re added to Control.Layers. FeatureGroup is stamped because it’s passed as the context to layer.on in FeatureGroup.js:19.

Not sure how to fix this:

• stamping each layer while initializing? Seems dirty.
• Different sorting mechanism in Control.Layers?

http://jsfiddle.net/km5H9/1/

[patrickarlt]

If anyone here is using Leaflet 1.0.0 you should be able to use the new pane option to control this:

map.createPane('bottom');
map.createPane('middle');
map.createPane('top');

// now pane order controls layer ordering not the control!
L.control.layers({
    'OSM': L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map)
}, {
    'bottom': L.geoJson(geojson, {pane: 'bottom'}),
    'middle': L.geoJson(geojson, {pane: 'middle'}),
    'top':  L.geoJson(geojson, {pane: 'top'}),,
}, {
    collapsed: false
}).addTo(map);

You can see this inaction with lots of overlapping polygons here.

[jieter]

Huh, I already made a PR for this…