SymbolLayer

API Reference (beta) for <SymbolLayer />

Property Type Description
id
optional
string
-
source
optional
string
-
sourceLayer
optional
string
-
beforeId
optional
string
-
children
optional
Snippet<[]>
-
metadata
optional
unknown
-
minzoom
optional
number
-
maxzoom
optional
number
-
filter
optional
FilterSpecification
-
layout
optional
{
  symbol-placement?: PropertyValueSpecification<"point" | "line" | "line-center">,
  symbol-spacing?: PropertyValueSpecification<number>,
  symbol-avoid-edges?: PropertyValueSpecification<boolean>,
  symbol-sort-key?: DataDrivenPropertyValueSpecification<number>,
  symbol-z-order?: PropertyValueSpecification<"source" | "auto" | "viewport-y">,
  icon-allow-overlap?: PropertyValueSpecification<boolean>,
  icon-overlap?: PropertyValueSpecification<"never" | "always" | "cooperative">,
  icon-ignore-placement?: PropertyValueSpecification<boolean>,
  icon-optional?: PropertyValueSpecification<boolean>,
  icon-rotation-alignment?: PropertyValueSpecification<"auto" | "map" | "viewport">,
  icon-size?: DataDrivenPropertyValueSpecification<number>,
  icon-text-fit?: PropertyValueSpecification<"none" | "width" | "height" | "both">,
  icon-text-fit-padding?: PropertyValueSpecification<[number, number, number, number]>,
  icon-image?: DataDrivenPropertyValueSpecification<string>,
  icon-rotate?: DataDrivenPropertyValueSpecification<number>,
  icon-padding?: DataDrivenPropertyValueSpecification<PaddingSpecification>,
  icon-keep-upright?: PropertyValueSpecification<boolean>,
  icon-offset?: DataDrivenPropertyValueSpecification<[number, number]>,
  icon-anchor?: DataDrivenPropertyValueSpecification<"center" | "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">,
  icon-pitch-alignment?: PropertyValueSpecification<"auto" | "map" | "viewport">,
  text-pitch-alignment?: PropertyValueSpecification<"auto" | "map" | "viewport">,
  text-rotation-alignment?: PropertyValueSpecification<"auto" | "map" | "viewport" | "viewport-glyph">,
  text-field?: DataDrivenPropertyValueSpecification<string>,
  text-font?: DataDrivenPropertyValueSpecification<string[]>,
  text-size?: DataDrivenPropertyValueSpecification<number>,
  text-max-width?: DataDrivenPropertyValueSpecification<number>,
  text-line-height?: PropertyValueSpecification<number>,
  text-letter-spacing?: DataDrivenPropertyValueSpecification<number>,
  text-justify?: DataDrivenPropertyValueSpecification<"auto" | "center" | "left" | "right">,
  text-radial-offset?: DataDrivenPropertyValueSpecification<number>,
  text-variable-anchor?: PropertyValueSpecification<"center" | "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right"[]>,
  text-variable-anchor-offset?: DataDrivenPropertyValueSpecification<VariableAnchorOffsetCollectionSpecification>,
  text-anchor?: DataDrivenPropertyValueSpecification<"center" | "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">,
  text-max-angle?: PropertyValueSpecification<number>,
  text-writing-mode?: PropertyValueSpecification<"horizontal" | "vertical"[]>,
  text-rotate?: DataDrivenPropertyValueSpecification<number>,
  text-padding?: PropertyValueSpecification<number>,
  text-keep-upright?: PropertyValueSpecification<boolean>,
  text-transform?: DataDrivenPropertyValueSpecification<"none" | "uppercase" | "lowercase">,
  text-offset?: DataDrivenPropertyValueSpecification<[number, number]>,
  text-allow-overlap?: PropertyValueSpecification<boolean>,
  text-overlap?: PropertyValueSpecification<"never" | "always" | "cooperative">,
  text-ignore-placement?: PropertyValueSpecification<boolean>,
  text-optional?: PropertyValueSpecification<boolean>,
  visibility?: "none" | "visible"
}
-
paint
optional
{
  icon-opacity?: DataDrivenPropertyValueSpecification<number>,
  icon-color?: DataDrivenPropertyValueSpecification<string>,
  icon-halo-color?: DataDrivenPropertyValueSpecification<string>,
  icon-halo-width?: DataDrivenPropertyValueSpecification<number>,
  icon-halo-blur?: DataDrivenPropertyValueSpecification<number>,
  icon-translate?: PropertyValueSpecification<[number, number]>,
  icon-translate-anchor?: PropertyValueSpecification<"map" | "viewport">,
  text-opacity?: DataDrivenPropertyValueSpecification<number>,
  text-color?: DataDrivenPropertyValueSpecification<string>,
  text-halo-color?: DataDrivenPropertyValueSpecification<string>,
  text-halo-width?: DataDrivenPropertyValueSpecification<number>,
  text-halo-blur?: DataDrivenPropertyValueSpecification<number>,
  text-translate?: PropertyValueSpecification<[number, number]>,
  text-translate-anchor?: PropertyValueSpecification<"map" | "viewport">
}
-
onclick
optional
(ev: MapLayerMouseEvent) => void
-
ondblclick
optional
(ev: MapLayerMouseEvent) => void
-
onmousedown
optional
(ev: MapLayerMouseEvent) => void
-
onmouseup
optional
(ev: MapLayerMouseEvent) => void
-
onmousemove
optional
(ev: MapLayerMouseEvent) => void
-
onmouseenter
optional
(ev: MapLayerMouseEvent) => void
-
onmouseleave
optional
(ev: MapLayerMouseEvent) => void
-
onmouseover
optional
(ev: MapLayerMouseEvent) => void
-
onmouseout
optional
(ev: MapLayerMouseEvent) => void
-
oncontextmenu
optional
(ev: MapLayerMouseEvent) => void
-
ontouchstart
optional
(ev: MapLayerTouchEvent) => void
-
ontouchend
optional
(ev: MapLayerTouchEvent) => void
-
ontouchcancel
optional
(ev: MapLayerTouchEvent) => void
-