Discussion :

[jac83]

Bonjour,
administrateur d'un site dédié au Vtt, j'utilise leaflet pour afficher sur une carte des marqueurs provenant de données inscrites dans une base mysql.
Jusque là ça fonctionne .

Ensuite lorsque je fais un clic gauche sur les marqueurs, j'affiche le tracé gpx de la sortie concernée sur la carte ainsi qu'une popup avec les données correspondant au tracé affiché.

Une fois le (ou les) tracés affichés, un clic gauche sur le tracé permet d'afficher le profil d'élévation de la sortie et un clic droit permet de supprimer l'affichage du tracé. Je bloque pour le moment car je voudrai aussi faire disparaitre l'affichage du profil en même temps que le tracé (clic droit sur le tracé) .

J'ai eu beau essayer plusieurs solutions et lire la doc concernant leaflet et les plugins utilisés, je suis pour l'instant coincé .
un peu d'aide me ferait du bien.

-> page test pour que vous puissiez vous rendre compte
cordialement

[NoSmoking]

Bonjour,
c'est dans l'événement de ton marqueur, "oncontextmenu" que tu dois supprimer ton Control de la map

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
gpxblue.on('contextmenu', function (e) {
    map.removeLayer(gpxblue);
    map.removeControl(el);  
//    el.removeFrom(map);  // autre méthode
});

• Leaflet controls
• UI element

[jac83]

Bonjour,

Merci noSmoking d'être passé par là, ta solution marche super bien (j'ai modifié la page test du premier post) ... J'étais tellement dans mon "truc" que je me suis acharné à faire map.removeLayer(el) alors que el n'était pas un layer mais un control

J'ai aussi essayé en vain de faire apparaitre la popup avec les infos de la trace juste à côté du graphique de profil pour avoir plus de lisibilité sur la trace mais comme la popup se positionne avec lat et lng et non pas en position sur l'écran je n'y suis pas arrivé (il ne faut peut être pas passer par un popup) ... Si tu as une piste .

Merci pour la documentation, je n'avais pas regardé cette partie sur control ... Je n'avais pas percuté que el était un control

cordialement

[NoSmoking]

J'ai aussi essayé en vain de faire apparaitre la popup avec les infos de la trace juste à côté du graphique de profil pour avoir plus de lisibilité... (il ne faut peut être pas passer par un popup) ... Si tu as une piste .

effectivement tu peux passer par un control que tu positionnes également en bottomleft, par exemple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
var gpxInfo = L.Control.extend({
    options: {
      position: 'bottomleft'
    },
    onAdd: function (map) {
        var oDiv = L.DomUtil.create('div', 'leaflet-popup-content-wrapper leaflet-popup-content'); // classe à modifier suivant ton besoin
        oDiv.style.padding = '1em';      // on aére un peu
        oDiv.innerHTML = info;           // on ajoute le même contenu que celui que tu mets dans l'infoPopup
        return oDiv;
    }
});

ensuite sur le click du trajet tu affiches les deux

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
gpxblue.on('click', function (e) {
    if( this.info) return;
    this.info = new gpxInfo();
    el.addTo(map);
    map.addControl( this.info/*new gpxInfo()*/);
});

et enfin sur le contextmenu tu supprimes la totale

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
gpxblue.on('contextmenu', function (e) {
    map.removeLayer(gpxblue);
    map.removeControl(el);
    map.removeControl( this.info/*gpxInfo*/);
});

tu noteras le

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
if( this.info) return;
this.info = new gpxInfo();

qui permet d'éviter de multiples affichages du control lors de click répétés sur le trajet.

[jac83]

Bonsoir,
Je viens de mettre en pratique le code envoyé ... Ca marche (j'ai mis à jour la page test) , je suis bluffé et ça parait si simple (comme quoi,il vaut mieux un qui sait que 100 qui cherchent).

Il me reste à digérer tout ça et surtout bien comprendre comment ça fonctionne pour pouvoir le transformer et le réutiliser à ma guise .

J'apprends tout doucement grâce aux conseils prodigués sur le forum ...

Merci noSmoking pour les solutions proposées.

pour moi problème résolu