Zürich, Wed 8 Jan 2025

Positioning Names on Google Maps

In 1962, Eduard Imhof, a Swiss cartographer, wrote an article titled Positioning Names on Maps (PDF). The paper talks about rules on label placement for print maps. Today, most people use Google Maps on their mobile phones instead of print maps, so let us have a look at how Google positions names on their map.

Country Names

Let us start with country names. Starting from Zoom 2, Google Maps shows country names for a selection of countries. The label appears horizontally with normal letter spacing and does not have a circle or other symbolizer attached.

Country labels appear starting from zoom 2.

A bold font face is used and the font size increases with increasing zoom. There seem to be three categories of countries each having the same font size. Country names are not abbreviated with the exception of DRC, the Democratic Republic of the Congo. First letter is capitalized, the others are lowercase.

Country names are located in the area of the country. The label location can vary with zoom level to make space for other country names or for city names. The label "Spain" is for example north of the label "Portugal" at zoom 3, while at zoom 4 it is the other way round.

Iberian peninsula at zoom 3 on the left, and 4 on the right. Note how the country labels are moved to make space for the capital city labels.

Country labels have a maximum zoom which varies from country to country. "United States" for example disappears after zoom 6, while "Liechtenstein" disappears after zoom 9.

State/Province Labels

Google Maps shows state and province labels for large countries such as the US, Brazil, or India from zoom 3. State labels are fully capitalized and have a weaker color than country labels. The font is also thinner. Are low zoom levels with too little space for full names, abbreviations are used such as e.g."CO" for "COLORADO".

State labels appear abbreviated from zoom 3, and in full length where possible from zoom 4.

Similar to country labels, state/province labels are placed in different locations depending on the zoom level.

City Labels

City labels appear starting from zoom 4. At this zoom level, only a small selection of cities is shown such as Rome or Lisbon. With higher zoom more cities appear.

Cities appear from zoom 4 and once visible, they stay visible.

A symbolizer in the form of a small circle indicates the location of the city. The text label is either to the right or to the left of the symbolizer. The circles are white with a black outline, except capital cities which in addition have a black dot in the center.

Web vs Mobile

The screenshots shared so far are from the web version of Google Maps which uses Roboto as text font. It looks like Google Maps optimized label placement for exactly this font. It is impressive how they moved for example the labels of Portugal and Spain around depending on zoom level to make best use of the available space.

When zooming in on the web version of Google Maps, labels never blink. That is, once a label appears it stays visible also at higher zoom levels. This sounds trivial but is actually tricky to achieve e.g. because country labels may override city labels and collide them away.

The optimization of label placement for the Roboto font breaks however when we look at the mobile version of Google Maps on an Android Pixel phone. Here, the app does not use Roboto but probably rather Product Sans, the brand font of Google. Product Sans is recognizable by the Google style "G" for example in the village name "Grindelwald".

Grindelwald in the Google Maps mobile app on the left and the web version on the right. Note how the "G" looks different. Mobile probably uses Product Sans while web uses Roboto.

Since the app uses a different font, somewhat larger text size, and places text differently relative to the symbolizer, the optimizations that were done for Roboto do not work any more. For example, the label of "Zürich" blinks as you zoom in on the mobile app:

In the mobile version of Google Maps, the label of Zürich blinks during zoom. First image: low zoom where "Switzerland" and "Zürich" are visible. Second image: higher zoom where "Liechtenstein" appears too. Countries override cities so "Zürich" gets collided away. Third image: higher zoom again. "Zürich" has now enough space next to "Liechtenstein" and shows up again.