mpetazzoni / leaflet-gpx

A GPX track plugin for Leaflet.js
http://mpetazzoni.github.io/leaflet-gpx
BSD 2-Clause "Simplified" License
529 stars 114 forks source link

Show Gpx track when clicking on marker #111

Closed theuxo closed 3 years ago

theuxo commented 3 years ago

Hello,

I am using leaflet-gpx and I am stuck with a problem. I have a few markers and I would like to show/load a gpx route when user clicks on the specific marker (one at a time). Is that possible?

I have a var named mountains with array data and I show them in a different layer groups. Maybe I could also put a name of a gpx file into var mountains and then call it when loading gpx. Gpx files would be stored on local disk/domain.

Thanks for your help!

Code:

    var layer1= new L.layerGroup(); 
    var layer2 = new L.layerGroup();

    var mountains = [
      ["mountain1",46.38,14.25, "layer2" ],
      ["mountain2",46.37,13.83, "layer1"],
      ["mountain3",46.44,13.72, "layer1"],
      ];

     for (var i = 0; i < mountains.length; i++) {
        var marker = new L.marker([mountains[i][1], mountains[i][2]]).bindPopup(mountains[i][0])
        this[mountains[i][3]].addLayer(marker);
             };
             var baseMaps = {
        "Outdoors": outdoors,
        "Satellite": satellite
    };

    var overlayMaps = {
        "Alps": layer1,
        "Karawanks": layer2
    };

    L.control.layers(baseMaps, overlayMaps).addTo(map);

           /* Show GPX*/
    var url = 'mountain1.gpx';
    new L.GPX(url, {async: true}).on('loaded', function(e) {
    map.fitBounds(e.target.getBounds());
    }).addTo(map);
mpetazzoni commented 3 years ago

Yes, that's definitely possible, you just need to code it up. This isn't a leaflet-gpx issue though.