This repository contains the source code of the website gpx.studio, an online tool for GPX editing.
To play with the code locally:
- Get your own tokens at Mapbox and GraphHopper and put them in
res/keys.json. - Launch a local server in the root directory, for example using
python3 -m http.server.
- Load, edit and create new GPX files
- Change the starting time and speed of the activity
- Reverse the direction of a trace
- Reduce the number of track points
- Merge multiple traces together
- Support for waypoints: place and drag, edit information, duplicate
- Support for track segments (
<trkseg>) : extraction with smart waypoints matching and merge as track segments - Delete points and/or waypoints inside or outside a rectangle selection
- Export multiple traces as one or separately in the chosen order and respecting time precedence constraints (if any time data)
- Preserve and automatically extend speed, heart rate, cadence, power and temperature data
- Drag and drop to load and export files
- Support as many traces as you want with scrollable tabs
- Google Drive integration and add-on: select a file, save the new version and get a shareable link as well as code to embed the map
If you think something is missing from the website, please create an issue to discuss it or make a pull request if you can implement it yourself.
The website is translated by volunteers on a collaborative translation platform. You can help complete and improve the translations by joining the Crowdin project. If you would like to start the translation in a new language, contact me or create an issue. Apart from a good understanding of gpx.studio, some basic knowledge of HTML can be useful. Any help is greatly appreciated!
This project would not have been possible without the following amazing projects:
- Leaflet: awesome map library
- leaflet-gpx: parsing GPX files
- Leaflet.CondensedAttribution: attribution hidden by default
- Leaflet.Heightgraph: elevation profile
- Leaflet.Icon.Glyph: markers with icons for the waypoints
- Leaflet.TextPath: direction markers
- leaflet-distance-markers: distance markers
- leaflet-control-window: centered windows for all dialogs
- leaflet-control-geocoder: search for locations with chosen API
- leaflet-locatecontrol: center the map on user location
- leaflet-overpass-layer: get POI from Overpass API
- tilebelt: find correct tiles to request and access elevation data
- PNG.js: read raw PNG data to decode elevation from Mapbox Terrain-RGB tiles
- simplify2: line simplification algorithm
- js-xss: HTML sanitizer for waypoint text fields
- SortableJS: for swapping the tabs
- Font Awesome: nice icons
And the data, maps and APIs from Mapbox, GraphHopper, OpenStreetMap, OpenTopoMap, Maps.Refuges.Info, CyclOSM, IGN, Strava and Kumi Systems.