style layer

In Mapbox, a style layer, also known as a layer, exists within a map style. A layer references a data source that defines the features that should be appear when the layer is rendered, and it provides styling instructions that describe the visual properties that should be applied to those features when the layer is rendered. When a Mapbox style layer is successfully rendered by a client, the result is a map.

Style layers must adhere to the Mapbox Style Specification, which defines their required properties and available options.

You can create or edit a style layer with the Mapbox Studio style editor, or you can create or edit a style layer at runtime, programmatically, using code. Web and mobile applications can reference layers from multiple different tilesets or styles.

Example of a layer

In the following excerpt from a style, we show a layer that has an id of rivers:

    "layers": [
        {
            "id": "rivers",
            "type": "line",
            "source": "mapbox://mapbox.mapbox-streets-v8",
            "source-layer": "waterway",
            "paint": {"line-color": "#ffc0cb"}
        }
    ],

The rivers layer is a line type layer. It references a data source called mapbox://mapbox.mapbox-streets-v8, specifically referring to a source layer inside that vector tileset source called waterway. Then it gives styling instructions to render the line data from waterway with a line-color colored #FFC0CB, which is light pink.

You can see the complete style JSON here. Here is a map rendered using this style, including the rivers layer:

Finding layer ids

You can find the ids of style layers in a Mapbox style by opening the style and looking at the contents of the layers object inside the JSON.

You can also find the ids of style layers in a Mapbox style using the Mapbox Studio style editor. First, open the style in the Mapbox Studio style editor. Then, use either of these approaches:

  1. Click the Layers panel on the left and see style layers listed by id.
  2. Click the Settings button in the top toolbar and scroll down to Layer overview section, where you can see style layers listed by id.

Related resources: