Live Demo: https://akshmittal.github.io/RidgeView
This tool takes a GPX file and turns it into:
- A visual route on the map
- An elevation graph
- Peak and range information (structured in the sidebar)
- Route paths and markers
- A clean, functional UI
It’s built to help understand the shape and difficulty of a trek at a glance.
- Map Route Rendering using Leaflet
- Custom Markers for peaks and points of interest
- Dynamic Sidebar for ranges, routes and peaks
- Elevation Graph synced with the map
- Hover Marker showing point-specific elevation
- Manually Managed Polyline (for full control over route behavior)
- Simple, Clean UI Layout (sidebar + map + graph)
- Future GPX Upload Support (planned)
- Parse GPX file → extract coordinates + elevation
- Draw a polyline on the map
- Sync the elevation graph with the route points
- Display hover markers for interactive exploration
- Load peak and range data from a structured JS file
Straightforward. Nothing overengineered.
- HTML / CSS / Vanilla JavaScript
- Leaflet.js for map rendering
- Chart.js for elevation charts
- Modularised JS structure for both independent and dependent logics (future scalability)
Core features work well. UI is stable. Code is being cleaned and modularized. More structure and refinements are ongoing.
- Drag-and-drop GPX upload
- Multiple route layers
- Trek summary metrics (distance, elevation gain, highest point, etc.)
- Better markers + custom legend
- Cleaner, more polished UI
- General metrics panel (distance travelled, highest elevation, elevation gain, etc.)
I didn’t build this because I love tech — I actually don’t. I built it because I like mountains.
This project started making tech more bearable.