Svelte MapLibre GL

RawLayer

API Reference (beta) for <RawLayer />

Property Type Description
type
required 
"symbol" | "fill" | "line" | "circle" | "heatmap" | "fill-extrusion" | "raster" | "hillshade" | "color-relief" | "background"
-
id
optional 
string
-
source
optional 
string
-
beforeId
optional 
string
-
filter
optional 
FilterSpecification
-
source-layer
optional 
string
-
children
optional 
Snippet<[]>
-
metadata
optional 
unknown
-
minzoom
optional 
number
-
maxzoom
optional 
number
-
layout
optional 
{
  fill-sort-key?: DataDrivenPropertyValueSpecification<number>,
  visibility?: "none" | "visible"
} | {
  line-cap?: PropertyValueSpecification<"round" | "butt" | "square">,
  line-join?: DataDrivenPropertyValueSpecification<"round" | "bevel" | "miter">,
  line-miter-limit?: PropertyValueSpecification<number>,
  line-round-limit?: PropertyValueSpecification<number>,
  line-sort-key?: DataDrivenPropertyValueSpecification<number>,
  visibility?: "none" | "visible"
} | {
  symbol-placement?: PropertyValueSpecification<"line" | "point" | "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"
} | {
  circle-sort-key?: DataDrivenPropertyValueSpecification<number>,
  visibility?: "none" | "visible"
} | {
  visibility?: "none" | "visible"
} | {
  visibility?: "none" | "visible"
} | {
  visibility?: "none" | "visible"
} | {
  visibility?: "none" | "visible"
} | {
  visibility?: "none" | "visible"
} | {
  visibility?: "none" | "visible"
}
-
paint
optional 
{
  fill-antialias?: PropertyValueSpecification<boolean>,
  fill-opacity?: DataDrivenPropertyValueSpecification<number>,
  fill-color?: DataDrivenPropertyValueSpecification<string>,
  fill-outline-color?: DataDrivenPropertyValueSpecification<string>,
  fill-translate?: PropertyValueSpecification<[number, number]>,
  fill-translate-anchor?: PropertyValueSpecification<"map" | "viewport">,
  fill-pattern?: DataDrivenPropertyValueSpecification<string>
} | {
  line-opacity?: DataDrivenPropertyValueSpecification<number>,
  line-color?: DataDrivenPropertyValueSpecification<string>,
  line-translate?: PropertyValueSpecification<[number, number]>,
  line-translate-anchor?: PropertyValueSpecification<"map" | "viewport">,
  line-width?: DataDrivenPropertyValueSpecification<number>,
  line-gap-width?: DataDrivenPropertyValueSpecification<number>,
  line-offset?: DataDrivenPropertyValueSpecification<number>,
  line-blur?: DataDrivenPropertyValueSpecification<number>,
  line-dasharray?: PropertyValueSpecification<number[]>,
  line-pattern?: DataDrivenPropertyValueSpecification<string>,
  line-gradient?: ExpressionSpecification
} | {
  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">
} | {
  circle-radius?: DataDrivenPropertyValueSpecification<number>,
  circle-color?: DataDrivenPropertyValueSpecification<string>,
  circle-blur?: DataDrivenPropertyValueSpecification<number>,
  circle-opacity?: DataDrivenPropertyValueSpecification<number>,
  circle-translate?: PropertyValueSpecification<[number, number]>,
  circle-translate-anchor?: PropertyValueSpecification<"map" | "viewport">,
  circle-pitch-scale?: PropertyValueSpecification<"map" | "viewport">,
  circle-pitch-alignment?: PropertyValueSpecification<"map" | "viewport">,
  circle-stroke-width?: DataDrivenPropertyValueSpecification<number>,
  circle-stroke-color?: DataDrivenPropertyValueSpecification<string>,
  circle-stroke-opacity?: DataDrivenPropertyValueSpecification<number>
} | {
  heatmap-radius?: DataDrivenPropertyValueSpecification<number>,
  heatmap-weight?: DataDrivenPropertyValueSpecification<number>,
  heatmap-intensity?: PropertyValueSpecification<number>,
  heatmap-color?: ExpressionSpecification,
  heatmap-opacity?: PropertyValueSpecification<number>
} | {
  fill-extrusion-opacity?: PropertyValueSpecification<number>,
  fill-extrusion-color?: DataDrivenPropertyValueSpecification<string>,
  fill-extrusion-translate?: PropertyValueSpecification<[number, number]>,
  fill-extrusion-translate-anchor?: PropertyValueSpecification<"map" | "viewport">,
  fill-extrusion-pattern?: DataDrivenPropertyValueSpecification<string>,
  fill-extrusion-height?: DataDrivenPropertyValueSpecification<number>,
  fill-extrusion-base?: DataDrivenPropertyValueSpecification<number>,
  fill-extrusion-vertical-gradient?: PropertyValueSpecification<boolean>
} | {
  raster-opacity?: PropertyValueSpecification<number>,
  raster-hue-rotate?: PropertyValueSpecification<number>,
  raster-brightness-min?: PropertyValueSpecification<number>,
  raster-brightness-max?: PropertyValueSpecification<number>,
  raster-saturation?: PropertyValueSpecification<number>,
  raster-contrast?: PropertyValueSpecification<number>,
  raster-resampling?: PropertyValueSpecification<"linear" | "nearest">,
  raster-fade-duration?: PropertyValueSpecification<number>
} | {
  hillshade-illumination-direction?: PropertyValueSpecification<NumberArraySpecification>,
  hillshade-illumination-altitude?: PropertyValueSpecification<NumberArraySpecification>,
  hillshade-illumination-anchor?: PropertyValueSpecification<"map" | "viewport">,
  hillshade-exaggeration?: PropertyValueSpecification<number>,
  hillshade-shadow-color?: PropertyValueSpecification<ColorArraySpecification>,
  hillshade-highlight-color?: PropertyValueSpecification<ColorArraySpecification>,
  hillshade-accent-color?: PropertyValueSpecification<string>,
  hillshade-method?: PropertyValueSpecification<"standard" | "basic" | "combined" | "igor" | "multidirectional">
} | {
  color-relief-opacity?: PropertyValueSpecification<number>,
  color-relief-color?: ExpressionSpecification
} | {
  background-color?: PropertyValueSpecification<string>,
  background-pattern?: PropertyValueSpecification<string>,
  background-opacity?: PropertyValueSpecification<number>
}
-
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
-

Svelte MapLibre GL