CircleLayer

Mapbox spec: circle

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

CircleLayer

CircleLayer is a style layer that renders one or more filled circles 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 en existing layer in the style. Does not create a new 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

CircleLayerStyleProps

Customizable style attributes

circleSortKey

Name: circleSortKey

Mapbox spec: circle-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: ``

circleRadius

Name: circleRadius

Mapbox spec: circle-radius

Description

Circle radius.

Type

number

Default Value

5

Units

pixels

Minimum

0

Expression

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

circleRadiusTransition

Name: circleRadiusTransition

Description

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

Type

{ duration, delay }

Units

milliseconds

Default Value

{duration: 300, delay: 0}

circleColor

Name: circleColor

Mapbox spec: circle-color

Description

The fill color of the circle.

Type

color

Default Value

#000000

Expression

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

circleColorTransition

Name: circleColorTransition

Description

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

Type

{ duration, delay }

Units

milliseconds

Default Value

{duration: 300, delay: 0}

circleBlur

Name: circleBlur

Mapbox spec: circle-blur

Description

Amount to blur the circle. 1 blurs the circle such that only the centerpoint is full opacity.

Type

number

Default Value

0

Expression

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

circleBlurTransition

Name: circleBlurTransition

Description

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

Type

{ duration, delay }

Units

milliseconds

Default Value

{duration: 300, delay: 0}

circleOpacity

Name: circleOpacity

Mapbox spec: circle-opacity

Description

The opacity at which the circle will be drawn.

Type

number

Default Value

1

Minimum

0

Maximum

1

Expression

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

circleOpacityTransition

Name: circleOpacityTransition

Description

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

Type

{ duration, delay }

Units

milliseconds

Default Value

{duration: 300, delay: 0}

circleTranslate

Name: circleTranslate

Mapbox spec: circle-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

circleTranslateTransition

Name: circleTranslateTransition

Description

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

Type

{ duration, delay }

Units

milliseconds

Default Value

{duration: 300, delay: 0}

circleTranslateAnchor

Name: circleTranslateAnchor

Mapbox spec: circle-translate-anchor

Description

Controls the frame of reference for circleTranslate.

Type

enum

Default Value

map

Supported Values

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

Requires

circleTranslate

Expression

Parameters: zoom

circlePitchScale

Name: circlePitchScale

Mapbox spec: circle-pitch-scale

Description

Controls the scaling behavior of the circle when the map is pitched.

Type

enum

Default Value

map

Supported Values

map - Circles are scaled according to their apparent distance to the camera.
viewport - Circles are not scaled.

Expression

Parameters: zoom

circlePitchAlignment

Name: circlePitchAlignment

Mapbox spec: circle-pitch-alignment

Description

Orientation of circle when map is pitched.

Type

enum

Default Value

viewport

Supported Values

map - The circle is aligned to the plane of the map.
viewport - The circle is aligned to the plane of the viewport.

Expression

Parameters: zoom

circleStrokeWidth

Name: circleStrokeWidth

Mapbox spec: circle-stroke-width

Description

The width of the circle's stroke. Strokes are placed outside of the circleRadius.

Type

number

Default Value

0

Units

pixels

Minimum

0

Expression

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

circleStrokeWidthTransition

Name: circleStrokeWidthTransition

Description

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

Type

{ duration, delay }

Units

milliseconds

Default Value

{duration: 300, delay: 0}

circleStrokeColor

Name: circleStrokeColor

Mapbox spec: circle-stroke-color

Description

The stroke color of the circle.

Type

color

Default Value

#000000

Expression

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

circleStrokeColorTransition

Name: circleStrokeColorTransition

Description

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

Type

{ duration, delay }

Units

milliseconds

Default Value

{duration: 300, delay: 0}

circleStrokeOpacity

Name: circleStrokeOpacity

Mapbox spec: circle-stroke-opacity

Description

The opacity of the circle's stroke.

Type

number

Default Value

1

Minimum

0

Maximum

1

Expression

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

circleStrokeOpacityTransition

Name: circleStrokeOpacityTransition

Description

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

Type

{ duration, delay }

Units

milliseconds

Default Value

{duration: 300, delay: 0}