Lightness of Leaflet displays the brilliance of Google Maps in high-res

Lightness of Leaflet and brilliance of Google Maps in high res

We can be a little cheeky at flink. Last year we wrote on these pages an article titled "27 reasons not to use Google Maps". Drawing from a variety of tile providers, it show-cased 27 alternatives to the by now rather stale look & feel of the Google-anno-2006 map.

The article and the maps are still there. Still generated using the lightweight, mobile-optimised map rendering library Leaflet JS and its Drupal companion modules Leaflet and Leaflet More Maps.

But we've added something: Google Maps.

Yep, you read that correctly. We now call the article "27 reasons not to use Google Maps… and 2 to do so".

What are these 2 ? First, we realised that it was very easy to extend Leaflet More Maps, so that the lightness of the Leaflet API can now be applied to Google map tiles, without having to use or download anything from the slightly heavier Google Map API. All these maps are rendered via the smaller Leaflet JS API.
Second, while we were at it, for those lucky enough to read this on a high resolution screen, we implemented Google's high-dpi tile set.

Want to know how it works? Let us explain that another time. For now, if you have a Retina® or similar display, just compare and contrast for a second the standard and high-dpi versions of the Google roadmaps shown side-by-side on this demo page. See how much tighter and easier the fonts are to read? And how at certain zoom levels the almost furry-looking webs of streets appear sharp and fine like highly strung hairs?
Brilliant!

Thanks Google Maps. You're back in the good books ;-)

If you know of any providers serving up high-dpi versions of their map tiles, let us know and we'll add them to Leaflet More Maps for all of us to enjoy.

File under: 

Gut feelings about Drupal 8

Read More »