Create a collection of accurate maps in print quality along your gpx track, in your scale, your format and the infos you need.
- Accurate scale throughout the whole route
- Printable quality of 300dpi
- Customizable paper format up to A2, page margins and distance markers
Inspired by the bikeline Cycling guides and Openstreetmap, this application uses Mapbox GL JS to create the maps I need. Vector tiles enable rendering in 300dpi, high enough for printing. There are different styles available. Paper format, page margins and distance markers are customizable. You want a map in 1:85.000 on A5 paper along that winding river? No problem.
Logic and PDF generation of mapline
are performed client-side. Main external
libraries are Mapbox GL JS for map
creation and jsPDF for PDF generation.
Before you can use mapline
, you have to get your own Mapbox access
token. Save it in
src/mapboxtoken.js
:
export default '<your access token here>';
npm install
installs all needed dependenciesgulp watch
starts a development server on localhost:9966gulp bundle
bundles everything in www/, ready to deploy
An application written in Javascript, using WebGL and running entirely in the browser has of course some limitations.
- canvas size and hence the maximum page format depend on your graphics card
- Javascript engines have a hardcoded maximum string size. This limits the size of the output PDF to ~268.44MB
Before this javascript implementation using vector tiles, I wrote a Python programm which rendered the maps from a local PostGIS database. It took ages, it had some features which are still missing in Mapline
. This is what I want to implement in the future:
- a map style better suited for cycle tours and printing in black&white
- possibility to show points of views like drinking water or camping places
- a scale bar
- elevation stats and marking of steep slopes
- support for additional/multiple gpx features besides tracks and routes