Skip to content

recorder: Add interactive maps with clickable track points and data charts #3906

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open

recorder: Add interactive maps with clickable track points and data charts #3906

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
c8532b4
recorder: Add interactive maps with clickable track points and data c…
stweedo Jun 20, 2025
2185655
recorder: prioritize barometer altitude over GPS for elevation profile
stweedo Jun 27, 2025
1ed5594
recorder: show both barometer and GPS altitude in elevation chart
stweedo Jun 27, 2025
cf7abc5
recorder: Remove confirmation before delete
stweedo Jun 27, 2025
ae661f3
Update interface.html to adjust chart colors and dot size
stweedo Jun 27, 2025
78eca50
Update interface.html to add confirmation before track delete
stweedo Jun 28, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 21 additions & 4 deletions apps/recorder/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,12 +29,29 @@ Some apps like the [Run app](https://banglejs.com/apps/?id=run) are able to auto
as well. They need to define a `foobar.recorder.js` file - see the `getRecorders`
function in `lib.js` for more information.

## Graphing
## Viewing and Downloading Data

You can download the information to the PC using [the App Loader](https://banglejs.com/apps/?id=recorder). Connect
to your Bangle, then in `My Apps` click the disk icon next to the `Recorder` app to download data.
You can download and visualize the information using [the App Loader](https://banglejs.com/apps/?id=recorder). Connect
to your Bangle, then in `My Apps` click the disk icon next to the `Recorder` app to access the download interface.

You can also view some information on the watch.
### Interactive Web Interface

The download interface provides individual track visualization with:

* **Interactive Leaflet maps** - Each GPS track gets its own map using OpenStreetMap tiles
* **Track statistics** - Distance, duration, and track points automatically calculated
* **Start/End markers** - Green circles mark track start, red circles mark end points
* **Interactive track points** - Click anywhere along the GPS track to see detailed data at that point
* **Data popups** - View available data for each point (time, heart rate, altitude, speed, steps, battery, barometer - if recorded)
* **Interactive charts** - Collapsible graphs for heart rate, battery, steps, elevation, speed, and barometer data with PNG export
* **Download options** - KML, GPX, and CSV formats for individual tracks or all at once
* **Settings** - Option to include/exclude entries without GPS coordinates
* **Unit preferences** - Choose between metric, imperial, or auto-detect based on your locale
* **Mobile responsive** - Works well on all devices

### On-Watch Visualization

You can also view some information on the watch:

* Tap `View Tracks`
* Tap on the Track number you're interested in, and you'll see a page with information about that track...
Expand Down
Loading