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

Typescript error #146

Open quilkin opened 8 months ago

quilkin commented 8 months ago

I ma getting a type error with new L.GPX(route.url, { async: true, marker_options: { startIconUrl: '', endIconUrl: '', shadowUrl: '' } }) The error is Property 'GPX' does not exist on type 'typeof import("c:/Users/quilk/source/repos/ridehub/node_modules/@types/leaflet/index")'.ts(2339)

I see the line import * as L from "leaflet"; in the file index.d.ts for leaflet-gpx , but the editor is telling me that 'L' is declared but its value is never read.

mpetazzoni commented 7 months ago

@quilkin Did you also include @types/leaflet-gpx in your dependencies?

quilkin commented 7 months ago

It's in devDependencies of package.json but not in dependencies (as are several other type defs). I've moved on a bit from there - I needed to get a list of coords from your package so I have forked it at https://github.com/quilkin/leaflet-gpx to add a `get_coords()method. This will no doubt complicate a solution for typing errors.

mpetazzoni commented 7 months ago

I never implemented a get_coords() method because you can already get it from the polyline layer that gets created (with the L.Polyline.getLatLngs() method).

quilkin commented 7 months ago

Thanks - but how do I get a handle on the Polyline object when using new L.GPX() ? I've now worked around by parsing the GPX data separately to get the lat/lng array, but it seems a shame because you are already parsing it in your code. Anyway I have solved the typing issue now, thanks.

mpetazzoni commented 7 months ago

You can get it from Leaflet's layers, or more easily by adding an event listener on the addline event:

https://github.com/mpetazzoni/leaflet-gpx/blob/main/gpx.js#L575

quilkin commented 7 months ago

Thanks, but I don't know how to do either of those! I tried adding addEventListener('addline',routeLineAddHandler) but the handler isn't called.

mpetazzoni commented 6 months ago

@quilkin You need to pass the async: true option to the L.GPX constructor, otherwise the parsing of the GPX happens synchronously in the constructor and therefore before you have a chance to attach the event listener. I just checked with an example locally and it works as intended, and you can get access to the latlngs with:

new L.GPX(url, async: true).on('addline', (e) => { console.log(e.line._latlngs); });

I'll make that requirement more clear in the README.