Skip to content
maplibre-yaml

Variable label placement with offset

Replicates the MapLibre example Variable label placement with offset: each anchor pairs with its own offset.

The complete document

Section titled “The complete document”
variable-label-placement-with-offset.yaml
# yaml-language-server: $schema=https://docs.maplibre-yaml.org/schema/latest/map.schema.json
# Gallery twin of https://maplibre.org/maplibre-gl-js/docs/examples/variable-label-placement-with-offset/
# text-variable-anchor-offset pairs each anchor with its own offset. The key
# rides the spec-derived allowlist (it sits outside the curated schema
# subset) — no warning, no strict-validate failure.
type: map
id: variable-label-placement-with-offset
config:
  center: [-79.4512, 43.6568]
  zoom: 10
  mapStyle: "https://demotiles.maplibre.org/style.json"
layers:
  - id: poi-labels
    type: symbol
    source:
      type: geojson
      locations:
        - { coordinates: [-79.4512, 43.6568], name: High Park }
        - { coordinates: [-79.389, 43.6426], name: CN Tower }
        - { coordinates: [-79.3832, 43.6532], name: City Hall }
        - { coordinates: [-79.4197, 43.6668], name: Casa Loma }
    layout:
      text-font: ["Noto Sans Regular"]
      text-field: ["get", "name"]
      text-variable-anchor-offset: [top, [0, 1], bottom, [0, -2]]
      text-justify: auto
      text-size: 13
    paint:
      text-color: "#1d3557"
      text-halo-color: "#ffffff"
      text-halo-width: 1.5

What to notice

Section titled “What to notice”
  • text-variable-anchor-offset sits outside the curated schema subset and rides the spec-derived allowlist — it renders, and mlym validate --strict stays green.