Skip to main content

Layers

A style’s layers property lists all available layers in the style. The type of the layer is specified by the type attribute and must be one of background, circle, line, fill, symbol, raster, fill-extrusion, heatmap and hillshade.

Except for layers of type background, every layer must reference a source. Layers get data from a data source, optionally filter features, and then define styles for those features.

Here’s an example of layers in a style file:

"layers": [
  {
    "id": "water",
    "source": "mapmost-dark",
    "source-layer": "water",
    "type": "fill",
    "paint": {
      "fill-color": "#00ffff"
    }
  }
]

Layer properties​

filter​

Optional attribute. expression

An expression that specifies the source attribute condition. Show only features that match the filter criteria. Level expressions in filter are evaluated only at the integer level. Filter expression does not support ["feature-state",…]. The filter expression at the symbolic layer only supports ["pitch"] and ["distance-from-center"] expressions.

id​

Required attribute. string

The unique name of the layer.

layout​

Optional attribute. layout

Layout properties of the layer.

maxzoom​

Optional attribute. number. Value range: 0~24.

The maximum level of the layer. When the map level is equal to or greater than maxzoom, the layer will be hidden.

minzoom​

Optional attribute. number. Value range: 0~24.

The smallest level of this layer. When the map level is smaller than minzoom, the layer will be hidden.

paint​

Optional attribute. Paint

Default drawing properties for this layer.

source​

Optional attribute. string

The ID of the data source to use for this layer. This property is required for all layers except the background type.

source-layer​

Optional attribute. string

Only when the data source is a vector tile map, it needs to be defined as the layer name.

type​

Required attribute. enum. One of "background", "circle", "line", "fill", "symbol", "raster", "fill-extrusion", "heatmap", "hillshade".

"background": map background layer

"circle": point layer

"line": Line layer

"fill": polygon layer

"symbol": Symbol layer

"raster": Raster layer

"fill-extrusion": 3D extrusion layer

"heatmap": heat map layer

"hillshade": Hillshade layer

Layer sub-properties​

Layers have two sub-properties: layout and drawing properties.

  • Layout properties The layout properties of the layer. They are applied early in the rendering process and define how that layer’s data is passed to the GPU. Changes to layout properties require an asynchronous "layout" step.
  • Paint properties The paint properties of the layer. Applied later in the rendering process, changes to draw properties are simple and synchronous.

Background layer (background)​

The background style layer covers the entire map. Use a background style layer to configure a color or pattern to appear beneath all other map content. If the background layer is transparent or omitted from the style, any portion of the map view that does not display other style layers is transparent.

background-color​

Paint property. Optional attribute, type color, default value "#000000", conflicts with background-pattern attribute. Supports interpolate expressions. Indicates the color of the drawn background. Transitionable.

background-opacity​

Paint property. Optional attribute, number type, value range: 0~1, default value 1. Supports interpolate expression, indicating the opacity of the drawing background. Transitionable.

background-pattern​

Paint property. Optional attribute, type resolvedImage. Represents the name of the image in the sprite used to draw the image background. For seamless patterns, the image width and height must be an exponential multiple of 2 (2,4,8,…, 512). Note that zoom-related expressions will only be evaluated at integer zoom levels.

visibility​

Layout attribute. Optional attribute, enum type, one of "visible", "none", default value "visible". Indicates whether to display the layer, "visible": the layer is displayed, "none": the layer is hidden.

Point layer (circle)​

The circle style layer renders one or more filled circles on the map. You can use circle layers to configure the visual appearance of point or point collection features in vector tiles. The radius of the circle rendered by the circle layer is measured in screen units.

circle-blur​

Paint property. Optional attribute, number. Default value: 0. Supports feature-state and interpolate expressions. Transitionable.

Make the circle blurry. A value of 1 blurs the circle and only the center point is completely opaque.

circle-color​

Paint property. Optional attribute, color. Default value: "#000000". Supports feature-state and interpolate expressions. Transitionable.

Set the fill color of the circle.

circle-opacity​

Paint property. Optional attribute, number. Value range: 0~1, default value: 1. Supports feature-state and interpolate expressions. Transitionable.

Sets the opacity of the circle when drawn.

circle-pitch-alignment​

Paint property. Optional attribute, enum. One of "map", "viewport". Default value: "viewport".

Used to set the direction of the circle when the map is tilted.

"map": The circle is aligned with the plane of the map.

"viewport": The circle is aligned with the plane of the viewport.

circle-pitch-scale​

Paint property. Optional attribute, enum. One of "map", "viewport". Default value: "map".

Controls how the circle scales when the map is tilted.

"map": Circles are scaled based on their apparent distance from the camera.

"viewport": The circle is not scaled.

circle-radius​

Paint property. Optional attribute, number. Value range: ≥0, unit is pixel. Default value: 5. Supports feature-state and interpolate expressions. Transitionable.

Set the circle radius.

circle-sort-key​

Layout attribute. Optional attribute, number

Sorts the properties in ascending order based on this value. Features with higher sort keys will appear above features with lower sort keys.

circle-stroke-color​

Paint property. Optional attribute, color. Default value is "#000000". Supports feature-state and interpolate expressions. Transitionable.

Set the stroke color of the circle.

circle-stroke-opacity​

Paint property. Optional attribute, number. Value range: 0~1, default value: 1. Supports feature-state and interpolate expressions. Transitionable.

Set the opacity of the circle stroke.

circle-stroke-width​

Paint property. Optional attribute, number. Value range: ≥0, unit is pixel. Default value: 0. Supports feature-state and interpolate expressions. Transitionable.

Sets the width of the circle stroke. The stroke is placed outside the circle-radius.

circle-translate​

Paint property. Optional attribute, array. Units are pixels. Default value: [0,0]. Supports interpolate expressions. Transitionable.

Set the geometry offset. The values ​​are [x, y], where negative numbers represent left and top respectively.

circle-translate-anchor​

Paint property. Optional attribute, enum. One of "map", "viewport". Default value: "map". Requires circle-translate to be enabled.

Controls the reference frame of circle-translate.

"map": The circle is translated relative to the map.

"viewport": The circle is translated relative to the viewport.

visibility​

Layout attribute. Optional attribute, enum. One of "visible", "none". Default value "visible".

Whether to display this layer.

"visible": Layer display.

"none": The layer is hidden.

Line layer (line)​

The line layer style renders one or more polylines on the map. You can use line layers to configure the visual appearance of polyline or multipolyline features.

line-blur​

Paint property. Optional attribute, number type, value range: ≥0, unit is pixel, default value is 0. Supports feature-state and interpolate expressions. Transitionable. means applying blur to lines.

line-cap​

Layout attribute. Optional attribute, type enum. It is one of "butt", "round", "square", and the default value is "butt". "butt": A hat with square ends that is drawn to the exact endpoint of the line. "round": A rounded cap with a rounded end drawn outside the line’s endpoint with a radius of one-half the line width and centered on the line’s endpoint. "square": A cap with square ends drawn at half the line width beyond the endpoints of the line.

line-color​

Paint property. Optional attribute, type color, default value "#000000", conflicts with line-pattern. Supports feature-state and interpolate expressions. Transitionable. represents the color that will be used to draw the line.

line-dasharray​

Paint property. Optional attribute, array type, value range: ≥0, unit is line width, conflicts with line-pattern. Transitionable. Specifies the length of alternating dashes and gaps that form the dashed pattern. The length is later scaled by line width, to convert dash length to pixels, multiply its length by the width of the current line. Note that GeoJSON sources specifying lineMetrics: true will not render dashed lines at the expected scale. Also note that zoom-related expressions will only be evaluated at integer zoom levels.

line-gap-width​

Paint property. Optional attribute, number type, value range: ≥0, unit is pixel, default value is 0. Supports feature-state and interpolate expressions. Transitionable. Indicates drawing the wireframe outside the actual path of the line, and Value indicates the width of the internal gap.

line-gradient​

Paint property. Optional attribute, of type color, conflicts with line-pattern. A data source in "geojson" format is required and supports interpolate expression. Defines the gradient used to color line features. Can only be used with GeoJSON sources with "lineMetrics": true enabled.

line-join​

Layout attribute. Optional attribute, type enum, is one of "bevel", "round", "miter", and the default value is "miter". Shows road segments when connecting. "bevel": A connection with square ends drawn beyond the endpoint of the line at a distance of half the width of the line. "round": A connection with rounded ends that is drawn beyond and centered on the line endpoint at a radius of one-half the line width. "miter"": A connection point with a sharp angle that intersects the outside of the path endpoint.

line-miter-limit​

Layout attribute. Optional attribute, number type, default value 2, requires line-join to be "miter". Supports inserting expressions for automatically converting miter connections to bevel connections.

line-offset​

Paint property. Optional attribute, type number, unit is pixel, default value is 0. Supports feature-state and interpolate expressions. Transitionable. Represents the offset of the line. For linear features, positive values ​​offset the line to the right relative to the direction of the line, and negative values ​​offset it to the left. For polygon features, positive values ​​indicate concavity and negative values ​​indicate convexity.

line-opacity​

Paint property. Optional attribute, number type, value range: 0~1, default value 1. Supports feature-state and interpolate expressions. Transitionable. represents the opacity of the line when it is drawn.

line-pattern​

Paint property. Optional attribute, type resolvedImage. Transitionable. Represents the name of the image in the sprite used to draw the image line. For seamless patterns, the image width must be an exponential multiple of 2 (2,4,8,…, 512). Note that zoom-related expressions will only be evaluated at integer zoom levels.

line-round-limit​

Layout attribute. Optional attribute, type number, default value 1.05. Requires line-join to be "round" and supports interpolate expression. Represents the automatic conversion of shallow-angled circular connections into mitered connections.

line-sort-key​

Layout attribute. Optional attribute, of type number, sorts the features in ascending order based on this value. Features with higher sort keys will appear above features with lower sort keys.

line-translate​

Paint property. Optional attribute, array type, unit is pixel, default value [0,0]. Supports interpolate expressions. Transitionable. Represents the geometric offset, the value is [x, y], where negative numbers represent left and top respectively.

line-translate-anchor​

Paint property. Optional attribute, enum type, is one of "map", "viewport", the default value is "map", and line-translate needs to be enabled. "map": The line translates relative to the map, "viewport": The line translates relative to the view.

line-width​

Paint property. Optional attribute, number type, value range: ≥0, unit is pixel, default value 1. Supports feature-state and interpolate expressions, Transitionable. represents the line width.

visibility​

Layout attribute. Optional attribute, enum type, is one of "visible", "none", with the default value "visible". Indicates whether to display the layer, "visible": the layer is displayed, "none": the layer is hidden.

Surface layer (fill)​

A fill style layer renders one or more filled (optionally stroked) polygon features on the map. You can use fill layers to configure the visual appearance of polygon or multipolygon features.

fill-antialias​

Paint property. Optional attribute, type boolean, default value true. Indicates whether the padding should be anti-aliased.

fill-color​

Paint property. Optional attribute, type color, default value "#000000". Conflicts with fill-pattern and fill-waterflow-normal, supports feature-state and interpolate expressions. Transitionable. Represents the color of the filled part of the layer. This color can be specified as rgba using the alpha component. If enabled, the opacity of the color will not affect the opacity of the 1px stroke.

fill-gradient​

Paint property. Optional attribute, type color, default value "null". Defines the gradient color of polygon features. Can only be used for GeoJSON data whose data source is defined with fillMetrics, and supports interpolate expression.

fill-gradient-angle​

Paint property. Optional attribute, number type, value range: [0,360], unit is degree, default value is 0. The rotation angle of the gradient color of the polygon feature, rotates clockwise along the X-axis. The default rotation angle is 0: gradient from left to right along the X-axis.

fill-opacity​

Paint property. Optional attribute, containing number between 0 and 1. Supports feature-state and interpolate expressions. Transitionable. Represents the opacity of the entire fill layer, as opposed to the fill color. If a stroke is used, this value will affect the 1px stroke around the fill.

fill-outline-color​

Paint property. Optional attribute, type color, conflicts with fill-pattern, requires fill-antialias to be true. Supports feature-state and interpolate expressions. Transitionable. Represents the outline color of the fill, or if not specified, matches the value of the fill color.

fill-pattern​

Paint property. Optional attribute, type resolvedImage. Transitionable. Represents the name of the image used to draw the background of the image in the sprite sheet. For seamless patterns, the image width and height must be an exponential multiple of 2 (2,4,8,…, 512). Note that zoom-related expressions will only be evaluated at integer zoom levels.

fill-pattern-density​

Paint property. Optional attribute, type number. Default value is 1. Supports stops expression.

The number of times the map is repeated. The number of repetitions n means that the texture is rendered according to the size of 1/n. The larger the value, the denser the map rendering. The recommended value is a power of 2.

fill-sort-key​

Layout attribute. Optional attribute, of type number, sorts features according to this value in ascending order, with features with higher sort keys appearing above features with lower sort keys.

fill-translate​

Paint property. Optional attribute, type array, unit is pixels. Default value [0,0], supports interpolate expression. Transitionable. Represents the geometric offset, the value is [x, y], where negative numbers represent left and top respectively.

fill-translate-anchor​

Paint property. Optional attribute, enum type, is one of "map", "viewport", and the default value is "map". Requires fill-translate to be enabled. "map": The padding is transformed relative to the map, "viewport": The padding is transformed relative to the view.

fill-waterflow-normal​

Paint property. Optional attribute, type string. Use in conjunction with fill-water-noise to enable dynamic water effects.

Dynamic water surface normal map. It can be the name of an image resource that exists in the sprite, or the name of an image resource added through addImages.

fill-waterflow-noise​

Paint property. Optional attribute, type string. Use in conjunction with fill-waterflow-normal to enable dynamic water flow effects.

Dynamic water surface noise map. It can be the name of an image resource that exists in the sprite, or the name of an image resource added through addImages.

fill-waterflow-speed​

Paint property. Optional attribute, type number. Default value is 1.

Dynamic surface water velocity. The larger the value, the faster the speed. It can be negative.

fill-waterflow-time​

Paint property. Optional attribute, type string. The default value is the system’s current Beijing time. The format is: "yyyy-mm-dd hh-mm-ss", example: "2023-08-01 12:00:00".

Dynamic surface time. Used to calculate the sun’s ray angle.

fill-waterflow-reflect-sun​

Paint property. Optional attribute, type boolean. The default value is true.

Whether to reflect sunlight.

fill-waterflow-color​

Paint property. Optional attribute, type color.

Dynamic water color. By default, the water surface color is the built-in color, which is the color extracted from the fill-waterflow-noise map.

fill-waterflow-reflect-color​

Paint property. Optional attribute, type color. The default value is "#ffffff", which only takes effect if the fill-waterflow-color attribute is set.

Dynamic water reflection color.

fill-waterflow-reflect​

Paint property. Optional attribute, type boolean. The default value is true.

Whether to turn on water reflection.

fill-waterflow-reflect-wave-u​

Paint property. Optional attribute, type number. Default value is 0.1.

Reflection edge blur coefficient - horizontal direction. The larger the value, the blurrier the reflection.

fill-waterflow-reflect-wave-v​

Paint property. Optional attribute, type number. Default value is 0.1.

Reflective edge blur factor - vertical direction. The larger the value, the blurrier the reflection.

visibility​

Layout attribute. Optional attribute, type enum. It is one of "visible" and "none", and the default value is "visible". Indicates whether to display the layer, "visible": the layer is displayed, "none": the layer is hidden.

Symbol layer (symbol)​

Symbol layers are used to render icons and text labels at points or lines on a map. You can use symbol album layers to configure the visual appearance of feature labels in vector tiles.

icon-allow-overlap​

Layout attribute. Optional attribute, boolean. Default value false. Requires icon-image to be enabled.

If true, the icon will be visible even if it collides with other previously drawn symbols.

icon-anchor​

Layout attribute. Optional attribute, enum. One of "center", "left", "right", "top", "bottom", "top-left", "top-right", "bottom-left", "bottom-right". Default value "center". Requires icon-image to be enabled.

Part icon near anchor point.

"center": The center position of the icon is closest to the anchor point.

"left": The left side of the icon is closest to the anchor point.

"right": The right side of the icon is closest to the anchor point.

"top": The top of the icon is closest to the anchor point.

"bottom": The bottom of the icon is closest to the anchor point.

"top-left": The upper left corner of the icon is closest to the anchor point.

"top-right": The upper right corner of the icon is closest to the anchor point.

"bottom-left": The lower left corner of the icon is closest to the anchor point.

"bottom-right": The lower right corner of the icon is closest to the anchor point.

icon-color​

Paint property. Optional attribute, color. Default value: "#000000". Requires icon-image to be enabled. Supports feature-state and interpolate expressions. Transitionable.

The color of the icon. Can only be used with SDF icons.

icon-halo-blur​

Paint property. Optional attribute, number. Value range: ≥ 0, unit is pixel. Default value: 0. Requires icon-image to be enabled. Supports feature-state and interpolate expressions. Transitionable.

The halo gradually fades outward.

icon-halo-color​

Paint property. Optional attribute, color. Default value: "rgba(0, 0, 0, 0)". Requires icon-image to be enabled. Supports feature-state and interpolate expressions. Transitionable.

The color of the icon halo. Icon glows can only be used with SDF icons.

icon-halo-width​

Paint property. Optional attribute, number. Value range: ≥0, unit is pixel. Default value 0. Requires icon-image to be enabled. Supports feature-state and interpolate expressions. Transitionable.

The distance from the halo to the icon outline.

icon-ignore-placement​

Layout attribute. Optional attribute, boolean. Default value false. Requires icon-image to be enabled.

If true, other symbols can be visible even if they collide with the icon.

icon-image​

Layout attribute. Optional attribute, resolvedImage

The name of the image used to draw the image background in sprite sheets.

icon-keep-upright​

Layout property. Optional attribute, boolean. Default value false. It is necessary to enable icon-image, icon-rotation-alignment as "map", symbol-placement as "line" or "line-center".

If true, the icon may be flipped to prevent it from appearing upside down.

icon-offset​

Layout property. Optional attribute, array. Default value: [0,0]. Requires icon-image to be enabled. Supports interpolate expressions.

The offset distance of the icon from its anchor point. Positive values ​​represent right and bottom, negative values ​​represent left and top. Multiply each component by the value of icon-size to get the final offset in pixels. When combined with icon-rotatez, the offset will be as if the rotation direction was up.

icon-opacity​

Paint property. Optional attribute, number. Value range: 0~1, default value 1. Requires icon-image to be enabled. Supports feature-state and interpolate expressions. Transitionable.

Used to set the opacity of the icon when drawing.

icon-optional​

Layout property. Optional attribute, boolean. Default value: false. icon-image and text-field need to be enabled.

If true, when the icon collides with other symbols but the text does not, the text will not show the corresponding icon.

icon-padding​

Layout property. Optional attribute, number. Value range: ≥0, unit is pixel. Default value: 2. Requires icon-image to be enabled. Supports interpolate expressions.

The size of the additional area around the icon bounding box used to detect symbol collisions.

icon-pitch-alignment​

Layout attribute. Optional attribute, enum. One of "map", "viewport", "auto". Default value: "auto". Requires icon-image to be enabled.

Used to set the direction of the icon when the map is tilted.

"map": The icon is aligned with the plane of the map.

"viewport": The icon is aligned with the plane of the viewport.

"auto": Automatically match the value of icon-rotation-alignment.

icon-rotate​

Layout property. Optional attribute, number. The unit is degrees. Default value: 0. Requires icon-image to be enabled. Supports interpolate expressions.

Used to set the angle of clockwise rotation of the icon.

icon-rotation-alignment​

Layout attribute. Optional attribute, enum. One of "map", "viewport", "auto". Default value: "auto". Requires icon-image to be enabled.

Combined with symbol-placement, determines how the icon is rotated.

"map": When symbol-placement is set to point, align the icon east-west. When symbol-placement is set to line or line-center, aligns the icon’s x-axis with a straight line.

"viewport": Generates an icon with its x-axis aligned with the view’s x-axis, regardless of the value of symbol-placement.

"auto": When symbol-placement is set to point, this is equivalent to viewport. When symbol-placement is set to line or line-center, this is equivalent to "map".

icon-size​

Layout property. Optional attribute, number. Value range: ≥0, the unit is the original icon size of the feature. Default value: 1. Requires icon-image to be enabled. Supports interpolate expressions.

Scales the original size of the icon according to the provided factor. The new pixel size of the image will be the original pixel size multiplied by the icon size. 1 is the original size; 3 is three times the image size.

icon-text-fit​

Layout attribute. Optional attribute, enum. One of "none", "width", "height", "both". Default value "none". icon-image and text-field need to be enabled.

Used to scale the icon to fit the associated text.

"none": The icon is displayed in its native aspect ratio.

"width": The icon is scaled on the x-axis to fit the width of the text.

"height": The icon is scaled on the y-axis to fit the height of the text.

"both": The icon is scaled on the x and y axes.

icon-text-fit-padding​

Layout attribute. Optional attribute, array. Units are pixels. Default value: [0,0,0,0]. icon-image, text-field, and icon-text-fit need to be enabled as "both" or "width" or "height". Supports interpolate expressions.

The size of the additional area added to the dimension is determined by the icon text size, in clockwise order: top, right, bottom, left.

icon-translate​

Paint property. Optional attribute, array. Default value pixels. Default value: [0,0]. Requires icon-image to be enabled. Supports interpolate expressions. Transitionable.

Used to set the distance the icon’s anchor point moves from its original position. Positive values ​​represent right and bottom, negative values ​​represent left and top.

icon-translate-anchor​

Paint property. Optional attribute, enum. One of "map", "viewport". Default value: "map". icon-image and icon-translate need to be enabled.

Controls the reference frame of icon-translate.

"map": The icon is translated relative to the map.

"viewport": The icon is translated relative to the viewport.

symbol-avoid-edges​

Layout attribute. Optional attribute, boolean. Default value: false.

If true, symbols will not cross tile edges to avoid collision with each other. Recommended for use on a layer that does not have enough fill vector tiles to prevent collisions, or for a point symbol layer that places it after a line symbol layer. When using a client that supports global conflict detection, such as Mapmost SDK for WebGL version 0.42.0 or later, this property does not need to be enabled to prevent labels from being clipped at tile boundaries.

symbol-placement​

Layout attribute. Optional attribute, enum. One of "point", "line", "line-center". Default value: "point".

The label is placed relative to its geometry.

"point": The label is placed at the location of the geometry.

"line": The label is placed along the straight line of the geometry. Can only be used with LineString and Polygon geometries.

"line-center": The label is placed at the line center of the geometry. Can only be used with LineString and Polygon geometries. Note that a single feature in a vector tile may contain multiple line geometries.

symbol-sort-key​

Layout attribute. Optional attribute, number

Sorts the properties in ascending order based on this value. Features with lower sort keys are plotted and put first. When icon-allow-overlap or text-allow-overlap is false, features with lower sort keys will have priority when placed. When icon-allow-overlap or text-allow-overlap is set to true, features with a higher sort key will overlap features with a lower sort key.

symbol-spacing​

Layout attribute. Optional attribute, number. Value range: ≥1, unit is pixel. Default value: 250. symbol-placement needs to be enabled as "line". Supports interpolate expressions.

Used to set the distance between two symbol anchors.

symbol-z-order​

Layout attribute. Optional attribute, enum. One of "auto", "viewport-y", "source". Default value "auto".

Determines whether overlapping symbols in the same layer are rendered in the order in which they appear in the data source, or by their position relative to the view’s y-axis. To control the order and priority of symbols, symbol-sort-key can be used.

"auto": If set, symbols are sorted by symbol-sort-key. Otherwise, if icon-allow-overlap or text-allow-overlap is set to true or icon-ignore-placement or text-ignore-placement is set to false, symbols are sorted according to their y position relative to the view.

"viewport-y": If icon-allow-overlap or text-allow-overlap is set to true or icon-ignore-placement or text-ignore-placement is set to false, then sort symbols according to their y position relative to the view.

"source": If set, symbols are sorted by symbol-sort-key. Otherwise, no sorting is applied; symbols are rendered in the same order as the source data.

text-allow-overlap​

Layout attribute. Optional attribute, boolean. Default value: false. Requires text-field to be enabled.

If true, the text will be visible even if it conflicts with other previously drawn symbols.

text-anchor​

Layout attribute. Optional attribute, enum. One of "center", "left", "right", "top", "bottom", "top-left", "top-right", "bottom-left", "bottom-right". Default value "center". Requires text-field to be enabled. Disable text-variable-anchor.

The portion of text placed closest to the anchor point.

"center": The center position of the text is closest to the anchor point.

"left": The left side of the text closest to the anchor point.

"right": The right side of the text closest to the anchor point.

"top": The top of the text is closest to the anchor point.

"bottom": The bottom of the text is closest to the anchor point.

"top-left": The upper left corner of the text is closest to the anchor point.

"top-right": The upper right corner of the text is closest to the anchor point.

"bottom-left": The lower left corner of the text is closest to the anchor point.

"bottom-right": The upper and lower right corners of the text are closest to the anchor point.

text-color​

Paint property. Optional attribute, color. Default value: "#000000". Requires text-field to be enabled. Supports feature-state and interpolate expressions. Transitionable.

The color used to draw text.

text-field​

Layout attribute. Optional attribute, formatted. default value:"".

Value to use for text labels. If a plain string is provided, it will be treated as a formatted string with default/inherited formatting options. Formatted text does not support SDF images.

text-font​

Layout attribute. Optional attribute, array. Default value: ["Open Sans Regular","Arial Unicode MS Regular"]. Requires text-field to be enabled.

The font type used to display text.

text-halo-blur​

Paint property. Optional attribute, number. Value range: ≥0, unit is pixel. Default value: 0. Requires text-field to be enabled. Supports feature-state and interpolate expressions. Transitionable.

Used to set the distance at which the halo fades outward.

text-halo-color​

Paint property. Optional attribute, color. Default value: "rgba(0, 0, 0, 0)". Requires text-field to be enabled. Supports feature-state and interpolate expressions. Transitionable.

Used to set the color of the text halo to distinguish it from the background.

text-halo-width​

Paint property. Optional attribute, number. Value range: ≥0, unit is pixel. Default value: 0. Requires text-field to be enabled. Supports feature-state and interpolate expressions. Transitionable.

Used to set the distance from the halo to the font outline. The maximum text halo width is 1/4 of the font size.

text-ignore-placement​

Layout attribute. Optional attribute, boolean. Default value false. Requires text-field to be enabled.

If true, other symbols can be visible even if they collide with the text.

text-justify​

Layout attribute. Optional attribute, enum. One of "auto", "left", "center", "right". Default value: "center". Requires text-field to be enabled.

Used to set text alignment options.

"auto": The text is aligned to the anchor position.

"left": The text is aligned to the left.

"center": The text is centered.

"right": The text is aligned to the right.

text-keep-upright​

Layout attribute. Optional attribute, boolean. Default value: true. You need to enable text-field, text-rotation-alignment as "map", symbol-placement as "line" or "line-center".

If true, the text can be flipped vertically to prevent it from rendering upside down.

text-letter-spacing​

Layout attribute. Optional attribute, number. The unit is ems. Default value: 0. Requires text-field to be enabled. Supports interpolate expressions.

Sets the spacing between letters in text.

text-line-height​

Layout attribute. Optional attribute, number. The unit is ems. Default value: 1.2. Requires text-field to be enabled. Supports interpolate expressions.

Used to set the line height between multiple lines of text.

text-max-angle​

Layout attribute. Optional attribute, number. The unit is degrees. Default value: 45. text-field and symbol-placement need to be enabled as "line" or "line-center". Supports interpolate expressions.

Used to set the maximum angle change between adjacent characters.

text-max-width​

Layout attribute. Optional attribute, number. Value range: ≥0, unit is ems. Default value: 10. text-field and symbol-placement need to be enabled as "point". Supports interpolate expressions.

Used to set the maximum line width when text is wrapped.

text-offset​

Layout attribute. Optional attribute, array. The unit is ems. Default value: [0,0]. Requires text-field to be enabled. Disable text-radial-offset. Supports interpolate expressions.

Used to set the offset distance of text from its anchor. Positive values ​​represent right and bottom, negative values ​​represent left and top. If used with text variable anchors, the input value will be treated as an absolute value. Offsets along the x and y axes will be automatically applied based on the anchor position.

text-opacity​

Paint property. Optional attribute, number. Value range: 0~1, default value 1. Requires text-field to be enabled. Supports feature-state and interpolate expressions. Transitionable.

Used to set the opacity of text when drawing.

text-optional​

Layout attribute. Optional attribute, boolean. Default value false. text-field and icon-image need to be enabled.

If true, when the text collides with other symbols but the icon does not, the icon will not display the corresponding text.

text-padding​

Layout attribute. Optional attribute, number. Value range: ≥0, unit is pixel. Default value: 2. Requires text-field to be enabled. Supports interpolate expressions.

The size of the additional area around the text bounding box used to detect symbol collisions.

text-pitch-alignment​

Layout attribute. Optional attribute, enum. One of "map", "viewport", "auto". Default value: "auto". Requires text-field to be enabled.

Used to set the direction of text when the map is tilted.

"map": The text is aligned with the plane of the map.

"viewport": The text is aligned with the plane of the viewport.

"auto": Automatically matches the value of text-rotation-alignment.

text-radial-offset​

Layout attribute. Optional attribute, number. The unit is ems. Default value: 0. Requires text-field to be enabled. Supports interpolate expressions.

Used to set the radial offset of the text in the direction of the symbol anchor point. Useful in combination with text-variable-anchor, which defaults to a 2D text offset if present.

text-rotate​

Layout attribute. Optional attribute, number. The unit is degrees. Default value: 0. Requires text-field to be enabled. Supports interpolate expressions.

Used to set the angle of clockwise rotation of text.

text-rotation-alignment​

Layout attribute. Optional attribute, enum. One of "map", "viewport", "auto". default value: "auto". Requires text-field to be enabled.

Combined with symbol-placement, determines how the individual symbols that make up the text are rotated.

"map": Align text objects when symbol-placement is set to point. When symbol-placement is set to line or line-center, aligns the x-axis of the text to the line.

"viewport": Generates a symbol whose x-axis is aligned with the view’s x-axis, regardless of the value of symbol-placement.

"auto": When symbol-placement is set to point, this is equivalent to viewport. This is equivalent to map when symbol-placement is set to line or line-center.

text-size​

Layout attribute. Optional attribute, number. Value range: ≥0, unit is pixel. Default value: 16. Requires text-field to be enabled. Supports interpolate expressions.

Used to set font size.

text-transform​

Layout attribute. Optional attribute, enum. One of "none", "uppercase", "lowercase". Default value: "none". Requires text-field to be enabled.

Specifies how to capitalize text, similar to the CSS text-transform property.

"none": No text changes.

"uppercase": Forces all letters to be displayed in uppercase.

"lowercase": Forces all letters to be displayed in lowercase.

text-translate​

Paint property. Optional attribute, array. Units are pixels. Default value [0,0]. Requires text-field to be enabled. Supports interpolate expressions. Transitionable.

The distance the text anchor point moves from its original position. Positive values ​​represent right and bottom, negative values ​​represent left and top.

text-translate-anchor​

Paint property. Optional attribute, enum. One of "map", "viewport". Default value "map". text-field and text-translate need to be enabled.

Controls the reference frame of text-translate.

"map": The text is translated according to the map.

"viewport": The text is translated relative to the view.

text-variable-anchor​

Layout attribute. Optional attribute, array. One of "center", "left", "right", "top", "bottom", "top-left", "top-right", "bottom-left", "bottom-right". text-field and text-translate need to be enabled as "point".

To increase the chances of placing high-priority labels on the map, you can provide an array of text anchor locations: the renderer will try to place a label at each location, before moving to the next label, in order. Use text-justify: auto to select alignment based on anchor position. To apply an offset, use text-radial-offset or 2D text-offset.

"center": The center position of the text is closest to the anchor point.

"left": The left side of the text closest to the anchor point.

"right": The right side of the text closest to the anchor point.

"top": The top of the text is closest to the anchor point.

"bottom": The bottom of the text is closest to the anchor point.

"top-left": The upper left corner of the text is closest to the anchor point.

"top-right": The upper right corner of the text is closest to the anchor point.

"bottom-left": The lower left corner of the text is closest to the anchor point.

"bottom-right": The lower right corner of the text is closest to the anchor point.

text-writing-mode​

Layout attribute. Optional attribute, array. One of "horizontal", "vertical". Requires text-field to be enabled.

Properties allow controlling the direction of the symbol. Note that the property value acts as a hint, so if a symbol’s language does not support the provided orientation, it will be laid out in its natural orientation. For example: English dot notation will be rendered horizontally even if the array value contains a single vertical' enumeration value. For symbols with dot layout, the order of the elements in the array defines the layout priority of the directed variables. For symbols with line layout, the default text writing mode is ['horizontal', 'vertical'] or ['vertical', 'horizontal'], the order does not affect the layout.

"horizontal": If the language of the text supports horizontal writing mode, symbols will be arranged horizontally.

"vertical": If the text language supports vertical writing mode, the symbols will be arranged vertically.

visibility​

Layout attribute. Optional attribute, enum. One of "visible", "none". Default value "visible".

Whether to display this layer.

"visible": Layer display.

"none": The layer is hidden.

Raster layer (raster)​

Raster style layers render raster tiles on the map. You can use raster layers to configure the color parameters of raster tiles.

raster-brightness-max​

Paint property. Optional attribute, number. Value range: 0~1, default value: 1. Supports interpolate expressions. Transitionable.

Increase or decrease the brightness of the image. This value is the maximum brightness.

raster-brightness-min​

Paint property. Optional attribute, number. Value range: 0~1, default value: 0. Supports interpolate expressions. Transitionable.

Increase or decrease the brightness of the image. This value is the minimum brightness.

raster-contrast​

Paint property. Optional attribute, number. Value range: -1~1, default value: 0. Supports interpolate expressions. Transitionable.

Increase or decrease the contrast of an image.

raster-fade-duration​

Paint property. Optional attribute, number. Value range: ≥0, unit is milliseconds. Default value: 300. Supports interpolate expressions.

Fade out duration when a new tile is loaded.

raster-hue-rotate​

Paint property. Optional attribute, number. The unit is degrees. Default value: 0. Supports interpolate expressions. Transitionable.

Rotate hues around the color wheel.

raster-mask​

Paint property. Optional attribute in the format of boolean. The default value is false.

Whether to enable grid mask.

raster-opacity​

Paint property. Optional attribute, number. Value range: 0~1, default value: 1. Supports interpolate expressions. Transitionable.

The opacity with which the image is drawn.

raster-resampling​

Paint property. Optional attribute, enum. One of "linear", "nearest". Default value: "linear".

Resampling/interpolation methods are used for superscaling, also known as texture upscaling filters.

"linear": (Bi)Linear filtering interpolates pixel values ​​using a weighted average of the four closest original source pixels, creating a smooth but blurry appearance when overscaled.

"nearest": Nearest neighbor filtering interpolates pixel values ​​using the closest original source pixel, creating a sharp but pixelated appearance when overscaled.

raster-saturation​

Paint property. Optional attribute, number. Value range: -1~1, default value: 0. Supports interpolate expressions. Transitionable.

Increase or decrease the saturation of the image.

visibility​

Layout attribute. Optional attribute, enum. One of "visible", "none". Default value: "visible".

Whether to display this layer.

"visible": Layer display.

"none": The layer is hidden.

Three-dimensional extrusion layer (fill-extrusion)​

fill-extrusion is used to render one or more filled (supports stroke) extruded (3D) polygons on the map. You can use this layer to configure the appearance of a polygon or multipolygon.

fill-extrusion-base​

Paint property. Optional, format is number. Value range: ≥0, unit is meters. Default value is 0. Requires fill-extrusion-height to be enabled. Supports feature-state and interpolate expressions.

The height value of the layer’s base. Must be less than or equal to fill-extrusion-height.

fill-extrusion-color​

Paint property. Optional, format is color. Default value is "#000000". This property has no effect if fill-extrusion-pattern or fill-extrusion-color-side is enabled. Supports feature-state and interpolate expressions.

The color of the extruded polygon base. The extruded surface will be shaded differently based on this color and light setting. If this color is specified as rgba with alpha form, the alpha value will be ignored; use fill-extrusion-opacity to set layer opacity.

fill-extrusion-color-side​

Paint property. Optional, format is color. Must be an interpolate expression. Example:

"paint": {
        "fill-extrusion-color-side":[
                "interpolate",
                ["linear"],
                ["fill-extrusion-progress"],
                0, "rgba(76, 153, 221, 0.0)",
                1, "rgba(76, 153, 221, 1.0)",
        ]
}

The color of the extruded body sides. The input value of the expression represents the height ratio from the bottom surface of the extruded body, ranging from 0-1, and the output is a color value.

fill-extrusion-color-top​

Paint property. Optional, format is color. The default color is the same as the side color of the extrusion body, which is the fill-extrusion-color value or the last color value of fill-extrusion-color-side. Supports interpolate expressions.

The color of the extruded body’s top surface.

fill-extrusion-height​

Paint property. Optional, format is number. Value range: ≥0, unit is meters. Default value is 0. Supports feature-state and interpolate expressions.

Stretch the height of this layer.

fill-extrusion-opacity​

Paint property. Optional, format is number. Value range: 0~1, default value 1. Supports interpolate expressions.

The transparency of the entire stretched layer. This feature is displayed on the entire layer, not on each feature of the layer, and does not support data-driven styles.

fill-extrusion-pattern​

Paint property. Optional, in the format of resolvedImage. This property has no effect if fill-extrusion-pattern-side or fill-extrusion-pattern-top is enabled.

The name of the image used to draw the image on the extruded layer in the sprite sheet. For seamless patterns, the image width and height must be powers of 2 (2,4,8,…, 512). Note that zoom-related expressions will only be evaluated at integer zoom levels.

fill-extrusion-pattern-density​

Paint property. Optional, format is number. The default value is 1. Supports stops expression.

The number of times the map is repeated. The number of repetitions n means that the texture is rendered according to the size of 1/n. The larger the value, the denser the map rendering. The recommended value is a power of 2.

fill-extrusion-pattern-side​

Paint property. Optional, in the format of resolvedImage. It takes effect when set together with fill-extrusion-pattern-top.

Extruded body side map. It can be the name of an image resource that exists in the sprite, or the name of an image resource added through addImages.

fill-extrusion-pattern-top​

Paint property. Optional, in the format of resolvedImage. It takes effect when set together with fill-extrusion-pattern-side.

Extruded volume top surface map. It can be the name of an image resource that exists in the sprite, or the name of an image resource added through addImages.

fill-extrusion-pattern-side-spread-h​

Paint property. Optional, format is boolean. The default value is true.

Whether the side map of the stretched body is stretched horizontally. When it is true, the side texture is stretched to the edge in the horizontal direction and covers the plane. When it is false, it is tiled in the horizontal direction according to the actual size of the texture.

fill-extrusion-pattern-side-spread-v​

Paint property. Optional, format is boolean. The default value is true.

Whether the side map of the stretched body is stretched in the vertical direction. When it is true, the side texture is stretched to the edge in the vertical direction and covers the plane. When it is false, it is tiled in the vertical direction according to the actual size of the texture.

fill-extrusion-translate​

Paint property. Optional, format is array. Units are pixels. Default value [0,0]. Supports interpolate expressions.

The geometric offset of the layer. Its value is [x, y], where negative numbers mean left and up (on the plane).

fill-extrusion-translate-anchor​

Paint property. Optional, the format is an enumeration type. It is one of "map" and "viewport". Default value "map". Requires fill-extrusion-translate to be enabled.

Reference anchor for the fill-extrusion-translate attribute.

"map": Stretch the layer relative to the map translation.

"viewport": Stretch the layer relative to the viewport translation.

fill-extrusion-vertical-gradient​

Paint property. Optional, format is boolean. Default value true.

Whether to apply a vertical gradient to the sides of the extruded layer. If true, the shadows on both sides will be slightly darker.

visibility​

Layout attribute. Optional, the format is an enumeration type. is enum. One of "visible", "none". Default value "visible".

Whether to display this layer.

"visible": Layer display.

"none": The layer is hidden.

Heat map layer (heatmap)​

A heat map style layer renders a series of colors to represent the density of points within an area.

heatmap-color​

Paint property. Optional, format is color. Default value ["interpolate",["linear"],["heatmap-density"],0,"rgba(0, 0, 255, 0)",0.1,"royalblue",0.3,"cyan",0.5,"lime",0.7,"yellow",1,"red"]. Supports interpolate expressions.

Defines the color of each pixel in the heat map based on its density value. An expression of ["heatmap-density"] should be used as input.

heatmap-intensity​

Paint property. Optional, the format is number. Value range: ≥0, default value 1. Supports interpolate expressions.

Similar to heatmap-weight, but controls the strength of the global heatmap. Mainly used to adjust heatmaps based on zoom level.

heatmap-opacity​

Paint property. Optional, the format is number. Value range: 0~1, default value 1. Supports interpolate expressions.

Global transparency when drawing heat layers.

heatmap-radius​

Paint property. Optional, the format is number. Value range: ≥1, unit is pixel. Default value is 30. Supports feature-state and interpolate expressions.

The radius of influence of the heat map points in pixels. Increasing this value will make the heatmap smoother but less detailed. queryRenderedFeatures on a heat layer will return points within this radius.

heatmap-weight​

Paint property. Optional, the format is number. Value range: ≥0, default value 1. Supports feature-state and interpolate expressions.

A measure of how much a single point contributes to a heat map. 10 is equivalent to having 10 points with a weight of 1 at the same position. Especially useful when combined with aggregations.

visibility​

Layout attribute. Optional, the format is an enumeration. is enum. One of "visible", "none". Default value "visible".

Whether to display this layer.

"visible": Layer display.

"none": The layer is hidden.

Hillshade layer (hillshade)​

The hill shading style layer renders digital elevation model (DEM) data client-side.

hillshade-accent-color​

Paint property. Optional, format is color. Default value is "#000000". Supports interpolate expressions.

Shadow colors used to accentuate rugged terrain such as steep cliffs and canyons.

hillshade-exaggeration​

Paint property. Optional, the format is number. Value range: 0~1, default value 0.5. Supports interpolate expressions.

The intensity of the shadow.

hillshade-highlight-color​

Paint property. Optional, format is color. The default value is "#FFFFFF". Supports interpolate expressions.

The background color of the area facing away from the light source.

hillshade-illumination-anchor​

Paint property. Optional, the format is an enumeration, which is enum. One of "map", "viewport". Default value "viewport".

The direction of the light source when the map is rotated.

"map": Hillshade lighting relative to the north direction.

"viewport": Hillshade lighting relative to the top of the view.

hillshade-illumination-direction​

Paint property. Optional, the format is number. Value range: 0~359, default value 335. Supports interpolate expressions.

If hillshade-illumination-anchor is set to viewport, the direction of the light source is the top of the view. If hillshade-illumination-anchor is set to map, the direction of the light source is true north.

hillshade-shadow-color​

Paint property. Optional, format is color. Default value is "#000000". Supports interpolate expressions.

The shadow color of areas facing away from the light source.

visibility​

Layout attribute. Optional, the format is an enumeration, which is enum. One of "visible", "none". Default value "visible".

Whether to display this layer.

"visible": Layer display.

"none": The layer is hidden.