New The Marauder's Map - Adding Labels


The Marauder's Map is my latest pet project. It is actually merely an excuse to play amongst Mapbox Studio. I decided that if I was going to larn how to pattern maps with Mapbox Studio and CartoCSS as well as so a Harry Potter themed map was equally skillful a projection equally any.

Images of the Marauder's Map used inwards the Harry Potter movies gave me the 2 basic colors used inwards the map for the map background as well as the edifice footprints. These are essentially the 2 layers that I started with.

They are defined inwards Mapbox Studio with:
Map {
  background-color: #cdad86;
}
#building {
 line-width: 1;
 line-color: #4d2a0f;
}
The map pattern inwards the Harry Potter movies seems to exclusively include these 2 basic layers but I idea my map looked a piddling strange without roads so I decided to add together roughly sparse white primary roads to my map.
#road {
   [class='main'] {
    ::case {
      line-width: 1;
      line-color: #fff;
    }
    ::fill {
      line-width: 1;
      line-color: #fff;
    }
  }
}
Next I actually wanted to add together roughly Harry Potter themed labels to the map. To firstly amongst I decided to switch out town as well as metropolis names amongst either 'Wizards', Muggles', 'Squibs' or Mudbloods. Luckily Mapbox Studio allows yous to supersede the existent names of towns as well as city's amongst whatever text. So all I quest to produce was supersede the identify names of all cities, towns, villages as well as neighborhoods amongst i of my 4 replacement words. So, for example, inwards my Marauder's Map all cities acquire re-labelled 'Muggles' ,
#place_label[localrank<=2] {
  [type='city'][zoom<=15] {
   text-name:  'Muggles';
    text-face-name: 'Gothic Ultra OT Regular';
    text-fill: #4d2a0f;
  }
To populate the map amongst to a greater extent than Harry Potter themed labels I decided to produce something similar amongst a publish of other Points of Information on the map. I thence changed the names of all stations to 'Hogwarts Express', all schools to 'Hogwarts', all parks to 'Quidditch', all cafes to 'Luchino Caffe', all bars to 'Hog's Head' as well as all fast-food restaurants to 'Apothecary'. e.g.
#poi_label[maki='school'] {
  text-name: "'Hogwarts'";
  text-face-name: 'Gothic Ultra OT Regular';
  text-fill: #4d2a0f;
}
I could acquit on adding to a greater extent than Harry Potter themed labels for other Points of Information but I intend this would terminate upwards making the map a piddling likewise crowded.

To avoid this overcrowding it is possible to define the zoom levels at which labels appear. You tin run into inwards a higher identify how the 'Muggles' identify cite for cities disappear from the map equally yous zoom-in by zoom marking xv on the map ( [type='city'][zoom<=15]). I added a similar zoom marking for roughly of the other labels so that they exclusively appear at dissimilar zoom levels e.g. bars (Hog's Head) volition exclusively appear at zoom marking xvi as well as higher (zoom>=16).
Buat lebih berguna, kongsi:
close