Leaflet : ajouter des groupes de marker dans le layerswitcher

Version imprimable

19/09/2023, 09h20
saxrub

Leaflet : ajouter des groupes de marker dans le layerswitcher

Bonjour

Si vous affichez la page https://visiolittoral.fr/ANDROID_CAR...LATITUDE=46.04 vous y trouverez des markers.

Ces markers sont regroupés par type (AGRI, PECHE, CHASSE..) dans autant de FeatureGroup que nécessaire.

J'aimerai que chaque FeatureGroup apparaisse dans le layerswitcher, ce qui permettrait de masquer/afficher certains types.

J'ai regardé la page https://leafletjs.com/examples/layers-control/ et essayé de reproduire le code.

Le problème c'est au final, ça ne fonctionne pas !

Une idée ?
20/09/2023, 14h21
elias couppe

Bonjour,

ton lien de démo est tronqué, impossible de se rendre compte du problème. Peux-tu nous mettre le lien complet ?
20/09/2023, 14h41
saxrub

Salut Elias

Le lien est corrigé dans le sujet mais je le redonne https://visiolittoral.fr/ANDROID_CAR...LATITUDE=46.04

Par contre la situation a évoluée !

On trouve maintenant les Featuregroup qui regroupent les markers par type dans le layerswitcher.

Le problème à résoudre est d'afficher dans le layerswitcher un libellé en clair en lieu et place du leaflet_id

Passer par la configuration du layerSwitcher pour modifier titre et description de la couche.

Par exemple :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
window.onload = function () {
      // on cache l'image de chargement du Géoportail.
      document.getElementById("map").style.backgroundImage = "none";
 
      // Création de la map
      var layer1 = L.geoportalLayer.WMTS({
        layer: "ORTHOIMAGERY.ORTHOPHOTOS"
      });
 
      var map = L.map('map', {
        zoom: 8,
        center: L.latLng(48.5, 2)
      });
 
      layer.addTo(map);
      var layer2 = L.markerClusterGroup();
      var coords = new L.latLng(48, 2);
      var coords2 = new L.latLng(49, 2);
      var coords3 = new L.latLng(48, 3);
 
      markers.addLayer(L.marker(coords));
      markers.addLayer(L.marker(coords2));
      markers.addLayer(L.marker(coords3));
 
      map.addLayer(markers);
 
      var layerSwitcher = L.geoportalControl.LayerSwitcher();
      map.addControl(layerSwitcher);
      layerSwitcher.addLayer(layer1, {
        config: {
          title: "test layer name 1",
          description: "test layer desc 1"
        }
      });
      layerSwitcher.addLayer(layer2, {
        config: {
          title: "test layer name 2",
          description: "test layer desc 2"
        }
      });
    };

20/09/2023, 16h09
saxrub

Nickel !