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 !.
banniere

Le portail francophone de la géomatique


Toujours pas inscrit ? Mot de passe oublié ?
Nom d'utilisateur    Mot de passe              Toujours pas inscrit ?   Mot de passe oublié ?

Annonce

Suite à un problème technique intervenu entre le 22 et le 23 mars, nous avons du procéder dans la soirée du 25 mars, à la restauration de la base de données du 24 mars (matinée).

En clair, nous avons perdu vos contributions et inscriptions du dimanche 24 et du lundi 25 mars.
Nous vous prions de nous excuser.

#1 Mon 11 February 2019 18:43

Femtome0903
Juste Inscrit !
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