Search notes:

Overpass Turbo extension for the Overpass API: {{style …}}

Add text to nodes

The following query prints all nodes in Croatia that have a place=city tag and annotates them with the value found in the population tag:
area[ 'ISO3166-1' = 'HR' ];

node[place=city](area);

out;

{{style:

  node {
     text: population;
  }

}}

Show the tramway lines of VBZ in their colors

relation
   [operator = 'Verkehrsbetriebe Zürich']
   [route    = 'tram'                   ];

out geom;

{{style:

   relation [ref= 2] { color: #CB0A25; }
   relation [ref= 3] { color: #00923C; }
   relation [ref= 4] { color: #322E71; }
   relation [ref= 5] { color: #70492C; }
   relation [ref= 6] { color: #BE8543; }
   relation [ref= 7] { color: #000000; }
   relation [ref= 8] { color: #8BC036; }
   relation [ref= 9] { color: #322E71; }
   relation [ref=10] { color: #CE1F75; }
   relation [ref=11] { color: #00923C; }
   relation [ref=12] { color: #92D6E3; }
   relation [ref=13] { color: #F6C828; }
   relation [ref=14] { color: #0093D0; }
   relation [ref=15] { color: #CB0A25; }
   relation [ref=17] { color: #8D1D2C; }

/* Don't clutter image with nodes */
   node { width: 0; symbol-size: 0.1;}

}}
TODO: Can the VBZ-relations colour attribute value be used to dynamically set a line's color using the eval and tag functions?

Color restaurants in Switzerland according to their names

The purpose of the following demonstration is to show how nodes can be colored using their fill-color, color and fill-opacity attribute:
{{geocodeArea: Switzerland }};

node
   [ amenity = restaurant ]
   [ name   ~'^(Rössli|Bahnhof|Löwen|Kreuz|Sternen|Hirschen|Post|Krone|Bären|Sonne|Linde|Traube|Ochsen)$' ]
   ( area );

out;

{{style:
   node { fill-opacity: 1 }

   node [name=Rössli]  { fill-color: grey   ; color: grey   }
   node [name=Bahnhof] { fill-color: black  ; color: black  }
   node [name=Löwen]   { fill-color: red    ; color: red    }
   node [name=Kreuz]   { fill-color: olive  ; color: olive  }
   node [name=Sternen] { fill-color: orange ; color: orange }
   node [name=Hirschen]{ fill-color: maroon ; color: maroon }
   node [name=Post]    { fill-color: purple ; color: purple }
   node [name=Krone]   { fill-color: beige  ; color: beige  }
   node [name=Bären]   { fill-color: brown  ; color: brown  }
   node [name=Sonne]   { fill-color: yellow ; color: yellow }
   node [name=Linde]   { fill-color: lime   ; color: lime   }
   node [name=Traube]  { fill-color: navy   ; color: navy   }
   node [name=Ochse]   { fill-color: teal   ; color: teal   }
}

See also

Adding icons onto a map.
The default style
Other extensions.

Index