Leaflet - Obtenir LatLng d'une Polyline sélectionné dans L.Control après chargement local HTML5

Leaflet FileLayer - Comment obtenir LatLng d'une Polyline sélectionné dans L.Control à ce niveau

Le problème exposé dans ce sujet a été résolu.

Bonjour,

1- Toujours en phase découverte de la puissance de leaflet, pour éviter de réinventer la roue, utilisation du plugin leaflet.filelayer.js Leaflet.FileLayer pour charger un par un ou en bloc des fichiers GPX présents localement.

Les polyline des trajets s’affichent sur la map et la récupération LatLng est possible à ce niveau.

2- Ajout d’un L.Control de manière à disposer de cases à cocher ayant pour libellé le nom racine du fichier chargé. Afficher ou masquer un ou des trajet(s) fonctionne.

Comment, sur détection du trajet sélectionné - donc affiché -, récupérer les LatLng de la seule polyline concerné ?

Dans ce cas de figure, je pensais utiliser le mot clef eachLayer, mais est-ce le bon et comment coder ?

Merci par avance.

// ================================================================
// Note : control.loader.on propre au pluging leaflet.filelayer.js 
// ================================================================
control.loader.on("data:loaded", function (e) {
    // Récupération du LatLng contenu dans le fichier chargé
    e.layer.on("click", function (e) {
        // Cibler uniquement une Polyline et non un Marker
        if (e.layer instanceof L.Polyline) {
            console.log(e.layer.getLatLngs());
            // Création d'une nouvelle Polyline pour traitement divers, distance ... à coder
            // let My_GPX = new L.Polyline(e.layer.getLatLngs())
        }
    });

    // ajout d'un overlayMaps
    layerControl.addOverlay(e.layer, e.filename.replace(/.gpx/g, "").replace(/.geojson/g, ""));
});
// ================================================================

let layerControl = new L.Control.Layers(null, overlayMaps, { collapsed: false }).addTo(map);

map.on("overlayadd", function (e) {
    // =================================================================================================
    // Comment récupérer directement sur sélection de la case à cocher LatLng de la Polyline affichée ?
    // =================================================================================================
    console.log("overlayMaps activé : " + e.name); // Ok
    console.log(e.name.getLayers().getLatLng()); // Nok
    console.log(e.getLayers().getLatLng()); // Nok
});

map.on("overlayremove", function (e) {
    // ...
});
+0 -0

Bonjour,

Ton e.layer correspond à une layer contenant une ou plusieurs PolyLignes, pour récupérer les PolyLignes il appelé la méthode e.layer.eachLayer et de grouper les géométries dans un tableau de coordonnées correspondant à la géométrie de ta ou tes Polylignes. Tu peut également utilisé la méthode e.layer.getLayers().length pour savoir combien de Polyligne tu as.

Si j’ai bien compris ta question, cela devrait résoudre ton problème.

Exemple :

map.on("overlayadd", function (e) {
    // =================================================================================================
    // Comment récupérer directement sur sélection de la case à cocher LatLng de la Polyline affichée ?
    // =================================================================================================
    console.log("overlayMaps activé : " + e.name); // Ok

    latlong = [];

    if(e.layer.getLayers().length == 1)
    {
        latlong = e.layer.getLayers()[0].getLatLngs();
    }
    else {
        e.layer.eachLayer(function(subLayer) {
            latlong.push(subLayer.getLatLngs());
        });
    }

    console.log(latlong); // Affichage des latlong
});
+0 -0

Bonsoir,

Effectivement c’est LA solution.

Un grand merci pour vos explications introuvable dans la doc et / ou sur github Leaflet.

Une dernière question comment éviter ce message en console :

"Uncaught TypeError: e.layer.getLayers(…)[0].getLatLngs is not a function"

Il se produit uniquement avec un fichier GPX ne contenant que des points d’intérêts (wpt).Fichier GPX ne contenant pas de balise (trkpt) permettant de générer une Polyline…

Quel type de test mettre en service avant appel ?

Merci beaucoup !

+0 -0
Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte