Skip to main content

FillLayer

Mapbox spec: fill

import { FillLayer } from '@rnmapbox/maps';

FillLayer

FillLayer is a style layer that renders one or more filled (and optionally stroked) polygons on the map.

props​

id​

string

required A string that uniquely identifies the source in the style to which it is added.

existing​

boolean

The id refers to an existing layer in the style. Does not create a new layer.

Change Layer Color, Show and hide layer

sourceID​

string

The source from which to obtain the data to style. If the source has not yet been added to the current style, the behavior is undefined. Inferred from parent source only if the layer is a direct child to it.

defaults to: Mapbox.StyleSource.DefaultSourceID

sourceLayerID​

string

Identifier of the layer within the source identified by the sourceID property from which the receiver obtains the data to style.

aboveLayerID​

string

Inserts a layer above aboveLayerID.

belowLayerID​

string

Inserts a layer below belowLayerID

layerIndex​

number

Inserts a layer at a specified index

filter​

FilterExpression

Filter only the features in the source layer that satisfy a condition that you define

minZoomLevel​

number

The minimum zoom level at which the layer gets parsed and appears.

maxZoomLevel​

number

The maximum zoom level at which the layer gets parsed and appears.

slot​

'bottom' | 'middle' | 'top'

The slot this layer is assigned to. If specified, and a slot with that name exists, it will be placed at that position in the layer order.

v11 only

style​

FillLayerStyleProps

Customizable style attributes

styles​

fillSortKey​

Name: fillSortKey

Mapbox spec: fill-sort-key

Description​

Sorts features in ascending order based on this value. Features with a higher sort key will appear above features with a lower sort key.

Type​

number

Expression​

Parameters: zoom, feature

visibility​

Name: visibility

Mapbox spec: visibility

Description​

Whether this layer is displayed.

Type​

enum

Default Value​

visible

Supported Values​

visible - The layer is shown.
none - The layer is not shown.

Expression​

Parameters: ``

fillAntialias​

Name: fillAntialias

Mapbox spec: fill-antialias

Description​

Whether or not the fill should be antialiased.

Type​

boolean

Default Value​

true

Expression​

Parameters: zoom

fillOpacity​

Name: fillOpacity

Mapbox spec: fill-opacity

Description​

The opacity of the entire fill layer. In contrast to the fillColor, this value will also affect the 1px stroke around the fill, if the stroke is used.

Type​

number

Default Value​

1

Minimum​

0

Maximum​

1

Expression​

Parameters: zoom, feature, feature-state, measure-light

fillOpacityTransition​

Name: fillOpacityTransition

Description​

The transition affecting any changes to this layer’s fillOpacity property.

Type​

{ duration, delay }

Units​

milliseconds

Default Value​

{duration: 300, delay: 0}

fillColor​

Name: fillColor

Mapbox spec: fill-color

Description​

The color of the filled part of this layer. This color can be specified as rgba with an alpha component and the color's opacity will not affect the opacity of the 1px stroke, if it is used.

Type​

color

Default Value​

#000000

Disabled By​

fillPattern

Expression​

Parameters: zoom, feature, feature-state, measure-light

fillColorTransition​

Name: fillColorTransition

Description​

The transition affecting any changes to this layer’s fillColor property.

Type​

{ duration, delay }

Units​

milliseconds

Default Value​

{duration: 300, delay: 0}

fillOutlineColor​

Name: fillOutlineColor

Mapbox spec: fill-outline-color

Description​

The outline color of the fill. Matches the value of fillColor if unspecified.

Type​

color

Disabled By​

fillPattern

Expression​

Parameters: zoom, feature, feature-state, measure-light

fillOutlineColorTransition​

Name: fillOutlineColorTransition

Description​

The transition affecting any changes to this layer’s fillOutlineColor property.

Type​

{ duration, delay }

Units​

milliseconds

Default Value​

{duration: 300, delay: 0}

fillTranslate​

Name: fillTranslate

Mapbox spec: fill-translate

Description​

The geometry's offset. Values are [x, y] where negatives indicate left and up, respectively.

Type​

array<number>

Default Value​

[0,0]

Units​

pixels

Expression​

Parameters: zoom

fillTranslateTransition​

Name: fillTranslateTransition

Description​

The transition affecting any changes to this layer’s fillTranslate property.

Type​

{ duration, delay }

Units​

milliseconds

Default Value​

{duration: 300, delay: 0}

fillTranslateAnchor​

Name: fillTranslateAnchor

Mapbox spec: fill-translate-anchor

Description​

Controls the frame of reference for fillTranslate.

Type​

enum

Default Value​

map

Supported Values​

map - The fill is translated relative to the map.
viewport - The fill is translated relative to the viewport.

Requires​

fillTranslate

Expression​

Parameters: zoom

fillPattern​

Name: fillPattern

Mapbox spec: fill-pattern

Description​

Name of image in sprite to use for drawing image fills. For seamless patterns, image width and height must be a factor of two (2, 4, 8, ..., 512). Note that zoomDependent expressions will be evaluated only at integer zoom levels.

Type​

resolvedImage

Expression​

Parameters: zoom, feature

fillPatternCrossFade​

Name: fillPatternCrossFade

Mapbox spec: fill-pattern-cross-fade

Description​

Controls the transition progress between the image variants of fillPattern. Zero means the first variant is used, one is the second, and in between they are blended together. Both images should be the same size and have the same type (either raster or vector).

Type​

number

Default Value​

0

Minimum​

0

Maximum​

1

Requires​

linePattern

Expression​

Parameters: zoom, measure-light

fillEmissiveStrength​

Name: fillEmissiveStrength

Mapbox spec: fill-emissive-strength

Description​

Controls the intensity of light emitted on the source features.

Type​

number

Default Value​

0

Units​

intensity

Minimum​

0

Requires​

lights

Expression​

Parameters: zoom, measure-light

fillEmissiveStrengthTransition​

Name: fillEmissiveStrengthTransition

Description​

The transition affecting any changes to this layer’s fillEmissiveStrength property.

Type​

{ duration, delay }

Units​

milliseconds

Default Value​

{duration: 300, delay: 0}