TM implementation using Leaflet for mapping

[Jim]

I spent a a few hours this evening converting TM's Google Maps API calls to the free and open Leaflet mapping API.  The conversion was remarkably straightforward.  I definitely have a bunch of kinks to work out and I have done only minimal testing so far, but I think this is going to work.  If you want to see what it looks like so far, keeping in mind that there's more I would add and a lot more testing I'd do before we make the switch, check out http://tml.teresco.org .  You can also see the new code on GitHub in the "leaflet" branch: https://github.com/TravelMapping/Web/tree/leaflet

For those unaware, our current Google Maps implementation could cease to function on June 11 when Google starts requiring billing information even for non-commercial use of their API.  I don't think we'll have any problem getting switched over to Leaflet well before that deadline hits.

[yakra]

Looks nice. Panning and zooming, and overall responsiveness seem faster than the Google API as well.

Yes, you still have kinks to work out, and I may be jumping the gun here, but...

• Can the default layer be set to OpenStreetMap instead of Stamen Terrain?
• Can custom / 3rd party tile sets be added?
• Shame about losing the satellite view, though...

[oscar]

Looks nice. Panning and zooming, and overall responsiveness seem faster than the Google API as well.

Yes, you still have kinks to work out, and I may be jumping the gun here, but...

• Can the default layer be set to OpenStreetMap instead of Stamen Terrain?
• Can custom / 3rd party tile sets be added?
• Shame about losing the satellite view, though...

Can we continue accessing Google Maps and satellite view through the Leaflet API? Both are useful in various ways (for example, GM is better than OSM at showing businesses and other landmarks, that can confirm the waypoint where I entered/left a route), even if we can't use them to grab coordinates for our mapping.

Is there open-source satellite imaging we can sub in, to replace the departed MQOpenSat?

[Jim]

There are tons of map tiles we can add pretty easily.  I've only tried these three to get started.  The big exception is Google's, since they don't make their tiles available directly from outside their own API, and workarounds out there that do so are a very clear violation of Google's terms.  I also don't want to make the Mapnik tiles the default, since we're not supposed to use their tile server.  We got away with it in our previous implementation but we could get blocked if usage is too heavy.  There's the option of running our own tile server to get the Mapnik which is some work but looks completely doable.

[Jim]

Check out https://github.com/leaflet-extras/leaflet-providers and let's think about which of these map tiles make sense to include.  If you like one, please check out its terms of service and make sure it seems like our usage would be appropriate.  Also make sure it has an appropriate range of zoom levels.  Some don't zoom in close enough for our purposes.

[si404]

http://leaflet-extras.github.io/leaflet-providers/preview/index.html

OpenStreetMap.Mapnik, OpenStreetMap.DE, HERE.normalDay and Esri.WorldStreetMap are ones we currently have.

OpenStreetMap.France (effectively the old Mapnik style) is one I'd like for sure.

HERE has a hybrid layer, Esri has a satellite layer.

HikeBike.HikeBike is a possible - it doesn't have much hiking or biking stuff on it and gives a different way of showing roads. OpenStreetMap.HOT, OpenMapSurfer.Roads, OpenTopoMap and Wikimedia likewise offer different renderings of the same/similar data, but there's only so many you can do.

[Jim]

I'm still trying out functionality, but the first version of HDX based on Leaflet is up.

http://coursesnew.teresco.org/metal/hdxl/

It could change without notice especially today as I continue testing and making fixes/improvements, but I'd be very happy to have additional testing.  You can mention things here or put issues in the EduTools repository.

Early testing shows that some things seem to be a little faster some slower.

[Jim]

Please test http://tml.teresco.org/ and report problems here or in GitHub issues.

[michih]

Loading a (simple) map takes about the same time. For instance France less than 10s on both: http://tml.teresco.org/user/mapview.php?units=miles&u=michih&rg=FRA

Loading a multi-region map takes about twice the time than on the old version (200s vs. 90s): http://tml.teresco.org/user/mapview.php?units=miles&u=michih&rg=DEU-BY,DEU-HE,DEU-BW,DEU-RP,DEU-SL,DEU-NW,FRA,LUX,BEL,IRL,NIR,SCT,WLS,ENG

Moving the map with mouse is incredibly slow with less and much data on the new server (both links above). It stucks and the map is not moving anymore.

Look at the multi-region map. The world is displayed twice. It's not centered to the relevant regions.

On top right "Show Route Table" is on top of tiles selection.

As already mentioned by you, tier order is wrong on maps (zIndex).

Some shields do not appear: http://tml.teresco.org/hb/index.php?units=miles&u=michih&r=deush.e47

Info window at waypoint does not appear when clicking on the table (but appears when clicking on the wp itself).

HB: Filter by region / system does not work (drop-down cannot be opened: http://tml.teresco.org/hb/index.php?units=miles&u=michih&sys=null&rg=DEU-SH

...

[si404]

Loading a multi-region map takes about twice the time than on the old version (200s vs. 90s): http://tml.teresco.org/user/mapview.php?units=miles&u=michih&rg=DEU-BY,DEU-HE,DEU-BW,DEU-RP,DEU-SL,DEU-NW,FRA,LUX,BEL,IRL,NIR,SCT,WLS,ENG

try taking NIR out - it could be the weird error where one point is at lon=-366 rather than -6 (which is now a datacheck, and also something that I've fixed locally) that's slowing stuff down.

[Jim]

I'm guessing @si404's observation might be correct about NIR.  Things are still slow in any case.

[Jim]

I also have some debugging output in there right now as I try to figure out how to get the route table on top of the map and the concurrent segments showing in the correct tier ordering.  So that will cause some extra slowness.

[michih]

Loading a multi-region map takes about twice the time than on the old version (200s vs. 90s): http://tml.teresco.org/user/mapview.php?units=miles&u=michih&rg=DEU-BY,DEU-HE,DEU-BW,DEU-RP,DEU-SL,DEU-NW,FRA,LUX,BEL,IRL,NIR,SCT,WLS,ENG

try taking NIR out

But I wanna travel there soon!

- it could be the weird error where one point is at lon=-366 rather than -6 (which is now a datacheck, and also something that I've fixed locally) that's slowing stuff down.

Yes, I think you are right. The map is loaded correct w/o NIR but it also worked with the Google API including NIR. Odd.

Zooming in is not possible with the map (w/o NIR). I pressed "+" 3 or 4 times and just have a grey screen now... (and loading circle in the middle)
When I go to a different TAB in my FF, where I have opened GitHub, I have the same problem now. CPU load 60...80%, more than 3 GB RAM usage. Never had this before...

[michih]

So that will cause some extra slowness.

Yep, it's slower than before. Route table is currently almost completely off my screen now... Well, no criticism...

[osu-lsu]

FWIW, When on leaflet, I cannot pull down the route table (not sure if that is by design right now, or a flaw)
Also, in the upper right corner there is a '3 sheet' icon where you can change maps. The option to choose OTM is covered by the box for the route table (you can reach the other two mapping options)

That and maybe finding a different color for our "pretend" truck route(s) for Ohio 37 around Delaware, Ohio for use on the maps.