Nous utilisons des cookies pour vous garantir la meilleure expérience sur notre site. Si vous continuez à utiliser ce dernier, nous considèrerons que vous acceptez l'utilisation des cookies. J'ai compris ! ou En savoir plus !.
Nom d'utilisateur    Mot de passe              Toujours pas inscrit ?   Mot de passe oublié ?

Annonce

Soutenez le GeoRezo en faisant un don !

Merci à tous pour votre fidélité.

don

L'équipe GeoRezo

 

#1 Mon 11 February 2019 18:43

Femtome0903
Membre
Date d'inscription: 11 Feb 2019
Messages: 3

Leaflet - Gestion du L.control.layers appliqués à des geojson en local

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.

Hors ligne

 

Pied de page des forums

Powered by FluxBB

Partagez  |