Standard tile layer

From OpenStreetMap Wiki
(Redirected from The Standard Map Style)
Jump to: navigation, search
Available languages — Standard tile layer
Afrikaans Alemannisch aragonés asturianu azərbaycanca Bahasa Indonesia Bahasa Melayu Bân-lâm-gú Basa Jawa Baso Minangkabau bosanski brezhoneg català čeština dansk Deutsch eesti English español Esperanto estremeñu euskara français Frysk Gaeilge Gàidhlig galego Hausa hrvatski Igbo interlingua Interlingue isiXhosa isiZulu íslenska italiano Kiswahili Kreyòl ayisyen kréyòl gwadloupéyen kurdî latviešu Lëtzebuergesch lietuvių magyar Malagasy Malti Nederlands Nedersaksies norsk norsk nynorsk occitan Oromoo oʻzbekcha/ўзбекча Plattdüütsch polski português português do Brasil română shqip slovenčina slovenščina Soomaaliga suomi svenska Tiếng Việt Türkçe Vahcuengh vèneto Wolof Yorùbá Zazaki српски / srpski беларуская български қазақша македонски монгол русский тоҷикӣ українська Ελληνικά Հայերեն ქართული नेपाली मराठी हिन्दी অসমীয়া বাংলা ਪੰਜਾਬੀ ગુજરાતી ଓଡ଼ିଆ தமிழ் తెలుగు ಕನ್ನಡ മലയാളം සිංහල ไทย မြန်မာဘာသာ ລາວ ភាសាខ្មែរ ⵜⴰⵎⴰⵣⵉⵖⵜ አማርኛ 한국어 日本語 中文(简体)‎ 吴语 粵語 中文(繁體)‎ ייִדיש עברית اردو العربية پښتو سنڌي فارسی ދިވެހިބަސް
Open bug tracker
Standard tile layer
OpenStreetMap Carto,osm-carto
Baclaran, Paranaque and Pasay Rotunda, Pasay
Baclaran, Paranaque and Pasay Rotunda, Pasay
Author: Andy Allan and Blacktocat.svg other contributors
Slippy map: openstreetmap.org
Usage policy: operations.osmfoundation.org/policies/tiles/
Tiles license: CC-BY-SA 2.0
Style website: Blacktocat.svg gravitystorm/openstreetmap-carto
Style license: Blacktocat.svg CC0 1.0

The Standard tile layer is the default tile layer on the OpenStreetMap homepage. It is often referred to by the name of the stylesheet "Blacktocat.svg OpenStreetMap Carto"[1] (or osm-carto for short).

Bug reports (e.g. rendering problems of specific object classes) can be raised Blacktocat.svg there (needs a login with a GitHub account).

OSM servers deployment

OSM homepage with standard tile layer

OSM tileservers have used the OpenStreetMap Carto style since August 2013. OSM tileserver generation statistics are available, you can read also about the tiles rendering process.

Low and medium zoom tiles (z0-z12) are usually re-rendered only when a new osm-carto version is being deployed and on the first Sunday of each month[2]. Database schema changes should not be requested more often than 1-2 times a year (probably combined with major PostgreSQL release).

If using the Standard tiles from openstreetmap.org tile servers in other applications, you must follow the Tile usage policy.

Map key

Since this style is feature rich, the short map key included on the OSM.org homepage is very limited. See Standard tile layer/Key and its subpages for the most complete and up to date legend version:

Major changes

Comparison of osm-carto in 2017 with the old version (London, zoom level 10)
  • 2012 - porting XML version to CartoCSS (start of the osm-carto)
  • 2013 - OSM tileservers deployment
  • 2014 - rewrite of buildings code
  • 2015 - road style change, SVG icons
  • 2016 - better rendering of placenames
  • 2017 - water color, mid zoom improvements, database schema change

Technical details

Design

The style is designed as a general purpose map of the world, so for example:

  • special objects (like seamarks or railway details) will not be rendered
  • labels are rendered with a name=* value (whatever it contains for a given object), so it's not displaying English names all over the world
  • there are no country specific symbols (like for example road shields or subway/metro signs), they all have a uniform look

While OpenStreetMap Carto tries to show many different objects, it's not possible to render everything stored in a database, so opt-in selection is made.

Blacktocat.svg Use cases for some zoom levels are defined.

Mapnik and CartoCSS

OpenStreetMap Carto tiles are rendered using the Mapnik toolkit. That being said, OpenStreetMap Carto and Mapnik are not the same thing! Mapnik is a map rendering library used for many map stylesheets (including OpenStreetMap Carto).

CartoCSS is used to pre-process the stylesheet into Mapnik XML format (since August 2013).

Rendering order

In this case upper residential area is larger than forest area and lower residential area is smaller than forest area

This style has multiple layers. For example names of waterways are rendered over waterways, shops are rendered over buildings, tunnels are rendered over buildings, roads are rendered over landcover etc.

The remaining question is how objects are rendered within layer. For some cases collisions are not allowed and objects that would cover already rendered object from given layer is not rendered. It is done for example for cities, where labels for smaller that would collide with label for larger one are not rendered.

Landcover areas are ordered by area, with smaller ones later and collisions are allowed. It means that for a given layer smaller areas will cover larger.

For example small leisure=park area will be rendered over larger landuse=residential area.

There is also a separate overlay layer containing for example tree symbols for forest landcover, that is rendered over landcover fill.

  • area covered by small landuse=forest and large landuse=residential
    • forest fill will be rendered over residential fill and cover it, later forest overlay will be rendered over that
  • area covered by large landuse=forest and small landuse=residential
    • residential fill will be rendered over forest fill and cover it, later forest overlay will be rendered over that

Database

OpenStreetMap Carto uses as its standard database PostgreSQL with PostGIS geospatial extension and is named "gis". It is derived from the OSM database, but does not store the full dataset - only the rendering-related elements are available. Since v4.0.0, OpenStreetMap Carto uses the PostgreSQL hstore (extension and data type) and is pre-processed with Blacktocat.svg a lua script by the osm2pgsql tool.

Code structure

General project configuration is included in Blacktocat.svg project.mml (YAML). There are defined so called "layers", which include mainly SQL statements selecting the objects, while actual styling is done in multiple MSS files.

Roads code is very complex and is partially generated by the helper scripts.

Icons and patterns

Icons are pixel-aligned vector images (SVG), generally based on 14 px matrix. While most of them are monochrome and their rendering color is defined in the MSS files, some of the icons have more than one color and they are defined in the vector file itself in such cases. Halftones might be used.

Some patterns are also done as vector images, but if they are still raster images (PNG), they are derived from vector elements and the process is Blacktocat.svg documented, so it should be easy to migrate to a vector format when possible.

Fonts

Noto font is used if possible, with DejaVu Sans, Hanazono and Unifont used as fallbacks.

External sources

The style relies partly on some external data files coming from Natural Earth and preprocessed OSM data repository OpenStreetMapData. They can be updated with a Python script (Blacktocat.svg scripts/get-shapefiles.py) or by hand.

Rendering coastline on openstreetmap.org is described here: Coastline#Rendering_in_Standard_tile_layer_on_openstreetmap.org.

Contributing and installing

You can set up a copy of the OpenStreetMap Carto rendering stylesheets for yourself. For more technical information, including setup instructions, see Blacktocat.svg gravitystorm/openstreetmap-carto on GitHub:

If you still don't know where to start, just ask for the assistance (for example in the ticket comments).

More experienced developers are also very welcomed. Some complex tasks that need attention are:

Forks and independent deployments

Apart from OSM.org deployment, osm-carto is being used for different independent services, like OSM Japan or Geofabrik Maps.

OpenStreetMap Carto is used as a base for other map style rendering forks, especially:

There is also a separate project called OpenGeofiction (OGF), which uses OSM tools - including osm-carto as default style - for creating maps of fictional places.

External links

General:

History:

Blog posts:

Talks:

Footnotes