A short post looking at tweaking base maps for seasonality using Mapbox Studio & CartoCSS.

We’ve been duped in our web mapping bubble. While its nice to think about our maps as simply being a canvas for the data we want to visualize. In reality the mapping platform and indeed the base map itself are absolutey critical in setting the tone of a map. The talented team at Mapbox have been yelling this message from the rafters. Over the last few days I have had to opportunity to drink some of their Kool-Aid.

Folks, I’ll be going back for seconds.

My project was simple, a trail map for our local nordic ski centre. In essence a map by which we would be able to navigate the ever growing trail network. The Caledonia Nordic Ski Centre provides excellent singletrack trails in the summer and worldclass nordic ski trails in the winter. I was looking for a base map to satisfy both these activities. I knew that Mapbox had blogged recently about their outdoor tiles so I was curious.

Mapbox Outdoors

There is no doubt these are very pretty, and would be very suitable for the summer singletrack, but they really don’t have the visual connection to the ski trails. A skier knows that the primary linkage with their environment is, well, snow. These outdoor tiles are altogether too “brown” and I needed something altogether whiter. A brief look around brought me to Mapbox’s Winter Wonderland tiles. These tiles are as wonderful as promised.

Mapbox Winter Wonderland

Though both these base maps are equally as attractive seperately, but they don’t flow so well with each other. In this case its mainly about the trees. Around Otway’s ski trails there are a great deal of trees. It’s Canada, of course there are trees! The winter wonderland tiles are well endowed with trees, our task was simply to copy the tree representation of the Open Street Map landcover “wood” class from the winter wonderland tiles to the outdoors tiles.

In essence this means editing the outdoor tile’s CartoCSS in Mapbox Studio (and adding the images, wood_12.png & wood_18.png)

#landcover {
  [class='wood'] {
    [zoom>=4] { polygon-fill:lighten(@wood, 5); }
    [zoom>=8] {
      polygon-fill: lighten(@wood, 5);
      polygon-pattern-file: url(img/wood_12.png);
    }
    [zoom>=17] {
      polygon-fill: lighten(@wood, 5);
      polygon-pattern-file: url(img/wood_18.png);
    }
  }
  [zoom>=4] {
    [class='scrub'] { polygon-fill: lighten(@scrub,26); }
    [class='grass'] { polygon-fill: @land; }
    [class='crop'] { polygon-fill: @land; }
    [class='snow'] { polygon-fill: @snow; }
    [class='wood'][zoom>=14],
    [class='scrub'][zoom>=15],
    [class='grass'][zoom>=16] {
    [zoom>=14] { polygon-opacity: 0.8; }
    [zoom>=15] { polygon-opacity: 0.6; }
    [zoom>=16] { polygon-opacity: 0.4; }
    [zoom>=17] { polygon-opacity: 0.2; }
  }
}

This was a surprisingly simple change and though Mapbox Studio is a complex interface, making these minor changes was a easy introduction to rolling my own base maps.

Amended Outdoor Tiles

The key here is considering the most effective method of communication for your map. Your base map can be altered in large or small ways to better align that communication. This way your tone can be more consistent, and your maps can look great.

Here are these basemaps in action