Question: can I get a timestamp from mouseover on gpx track

[marcobergman]

I'd like to show timestamp information about the gpx position on mouseover, but I cannot find this in the event. Is it available? Thx!

[mpetazzoni]

I don't believe that would be possible, since the only thing rendered is the polyline itself, and none of the individual points – presumably you'd need those to be rendered as distinct elements to have mouseover on each point to get its information and timestamp.

Maybe you could work something out with Polyline.closestLayerPoint()? But that still wouldn't give you access to the additional information about that point of the line.

[queueseven]

I implemented this feature today by changing the code a little bit.

By changing

 // add track
 var l = new L.Polyline(coords, this._extract_styling(line, base_style, polyline_options));

to

 // add track
 tmp = this._extract_styling(line, base_style, polyline_options)
 tmp.custom = coords;
 var l = new L.Polyline(coords, tmp);

you're able to access the parsed coordinate objects, which contain not only the location but also the timestamp etc.

Then you can search for the Polyline layer and add invisible Markers for each coordinate, like this:

polyline_layer.options.custom.forEach(ll => 
    L.marker([ll.lat, ll.lng], { clickable: false })
        .bindPopup('Timestamp: ' + ll.meta.time.toLocaleTimeString())
        .on('mouseover', function (e) {
            this.openPopup();
        })
        .on('mouseout', function (e) {
            this.closePopup();
        })
        .setOpacity(0)
        .addTo(map);
);

It would be awesome if leaflet-gpx could raise an event for every trkpt or let us access the coords with the meta data easily.

[mpetazzoni]

I didn't do that because I'm worried about the performance impact of raising an event for every point on the track (could be thousands). Maybe as an opt-in?