Le portail francophone de la géomatique

Bonjour,

Dans le cadre de notre projet tutoré ( en tant que débutants) basé sur Leaflet nous cherchons à améliorer notre rendu de carte actuel
pour permettre non seulement de switcher entre plusieurs fonds carto mais
également de permettre de cocher et décocher des geojson appelés sur notre fichier HTML ( nous avons uniquement la gestion des fonds
actuellement.

Notre code ressemble à ceci actuellement ( extraits ) :

--- Les sources utilisés ----

---------------------

---- Notre Gestion des Fonds Carto ------

var osmLink = 'Fond OpenStreetMap Mapnik ',
     thunLink = 'Fond Thunderforest',
     esriLink = 'Fond Esri',
     stamerLink = 'Fond Stamer';

var     osmUrl = 'http://{s}.tiles.wmflabs.org/bw-mapnik/{z}/{x}/{y}.png',
    osmAttrib = '© ' + osmLink,
   
    landUrl = 'http://{s}.tile.thunderforest.com/landscape/{z}/{x}/{y}.png',
    thunAttrib = '©' +thunLink + 'Fond OSM',
   
    esriUrl = 'http://server.arcgisonline.com/ArcGIS/r … z}/{y}/{x}',
    esriAttrib = 'Fond Esri '+esriLink,

    stamerUrl = 'http://{s}.tile.stamen.com/toner-lite/{z}/{x}/{y}.png',
    stamerAttrib = '©' + 'Fond toner stamer';
   
   
   var osmMap = L.tileLayer(osmUrl, {attribution: osmAttrib}),
        landMap = L.tileLayer(landUrl, {attribution: thunAttrib}),
            esriMap = L.tileLayer(esriUrl, {attribution: esriAttrib}),
                stamerMap = L.tileLayer(stamerUrl, {attribution: stamerAttrib});

var baseLayers = {
    "OSM B&W": osmMap,
    "Landscape": landMap,
    "Aerial": esriMap,
    "Stamer Toner ":stamerMap
    };

   L.control.layers(baseLayers).addTo(map);

Puis, notre manière d'appeler les geojson externes:

$.getJSON("faune_resize.geojson",function(data_polyFaune){
        L.geoJson(data_polyFaune,{
            onEachFeature: function (feature, layer) {
            layer.bindPopup(''+'id est:'+layer.feature.properties.id_obs+' site :'+feature.properties.site+'');
            }
        })
    .addTo(map);   
    })   

$.getJSON("cs31R.geojson",function(data_cs31){  // rouge
        L.geoJson(data_cs31,{
            onEachFeature: function (feature, layer) {
            layer.bindPopup(''+' la fiabilite est de :' +feature.properties.fiabilite);
            }
        })
    .addTo(map);   
    })   

-------------------------------

D'après ce que j'ai compris il faudrait que je modifie mon
"L.control.layers(baseLayers).addTo(map);" pour quelque chose comme
"L.control.layers(baseLayers,overlays).addTo(map);

Du coup il faudrait que notre overlays fasse, d'une manière ou d'une autre, référence aux geojson ci dessus mais
actuellement je n'ai pas trouvé dans la documentation leaflet et sur les exemples de JsFiddle ou codepen des exemples
pour faire cette liaison, si elle est possible.

Merci d'avance pour vos futures réponses.