Saturday, December 21, 2013

"Bosatlas" style for Google Maps

The Bosatlas, originally published in 1877 and now in its 54rd edition, is the map book everyone in the Netherlands knows from geography class. Entire generations grew up with the color scheme it uses for maps of the country; its orange cities, mauve industrial areas, and ruby highways and borders are deeply etched into the national soul. But now that Google Maps is usually the most readily available map, do we have to settle for its bland colors?

One thing that has slightly bothered me about Google Maps is that it doesn't really offer a good topographical map. Satellite images are nice, of course, but can sometimes be surprisingly hard to read. And the "Map" mode is more of a road map than a topographical map: The road network stands out, but terrain is represented in very light and washed out colors. Because of this, it can actually be pretty hard to tell cities and agricultural land apart.

So that is why I used the Google Maps API to make a custom map style emulating the color scheme of the Bosatlas. Try it out here, or see the image below for a comparison between my style (top) and the default (bottom), and here for a picture from an actual Bosatlas.

Some differences I am aware of:
  • The Bosatlas has different colors for pastureland and crops. It appears Google doesn't have this information
  • Same for the Bosatlas' yellow dunes and pink heath, and fresh vs salt water.
  • Railway lines only become visible at a certain zoom level in Google Maps. Ideally, they would also show in the map below, but it appears this currently isn't possible.
  • It would also be nice if I could underline provincial capital names, and style A-roads (primary motorways) differently from N-roads.
  • Similarly, tram lines are treated the same as the major rail network, while they shouldn't be visible at all.
  • I would like to show National Parks and other forests in the same shade of green, but haven't found how to do that.
  • Dikes are missing!
So what do you think? :) If you're interested, you can find a javascript function with the style I used here. Feel free to reuse it.