1 minute read

I created a Leaflet map with 2 layers for the moment and all my gpx. The goal is to be able to have an overview of the projects and possibilities I have when I want to organise something, to give ideas to thers and at the same time to learn a bit more about the surroundings. It is always useful to know, “Ah ja I was there … oh this is not far …”.

The gpx are sorted depending on projects and on type :

  • Green : Bike
  • Red : Hike
  • Blue : SkiTour

Then comes a bit more transparent gpx with a dash array, this are ‘Projects’ :)

I had to solve little difficulties with Leaflet but things are working great. Here a small list to avoid other people to get in the same troubles:

  • load all gpx in a folder
    • use a for loop
    • create a variable with all the relative paths of the gpx
      • Created automatically with an Rscript, listing the files depending on where there are. It is creating a file which I have to copy the content in the js code.
      • The list of the gpx at the end is also done this way (here the file)
  • Fullscreen option
  • Making layers for the maps
  • Making layer for the different type of gpx
  • loading only 1 map at a time and not both
    • little thing to know : in the L.map() option ‘layers’ define only 1 layer, but load the 2 in L.control.layers()

Howerver there are still things that I would like to do :

  • Use leaflet.Elevation
  • Highlight track by selecting

Just play with it :)

Have a look here

Updated: