Add a multidirectional hillshade layer

Replicates the MapLibre example Add a multidirectional hillshade layer: the Inn valley lit from four directions, each light with its own highlight and shadow color.

The complete document

add-a-multidirectional-hillshade-layer.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/add-a-multidirectional-hillshade-layer/
# `hillshade-method: multidirectional` lights the relief from several
# directions at once: the colour and direction paint properties take one
# entry per light. Needs maplibre-gl >= 5.5.0 (the docs site runs 6.x).
type: map
id: add-a-multidirectional-hillshade-layer
config:
  center: [11.491, 47.274]
  zoom: 10
  maxZoom: 18
  maxPitch: 85
  renderWorldCopies: false
  hash: true
  mapStyle: { version: 8, sources: {}, layers: [] }
sources:
  hillshadeSource:
    type: raster-dem
    url: "https://demotiles.maplibre.org/terrain-tiles/tiles.json"
    tileSize: 256
layers:
  - id: hillshade
    type: hillshade
    source: hillshadeSource
    paint:
      hillshade-method: multidirectional
      # Four lights: each highlight/shadow pair below belongs to the
      # direction (and altitude) at the same position.
      hillshade-highlight-color: ["#FF4000", "#FFFF00", "#40ff00", "#00FF80"]
      hillshade-shadow-color: ["#00bfff", "#0000ff", "#bf00ff", "#FF0080"]
      hillshade-illumination-direction: [270, 315, 0, 45]
      hillshade-illumination-altitude: [30, 30, 30, 30]

What to notice

• hillshade-method: multidirectional turns the light paint properties into lists: entry n of hillshade-illumination-direction, hillshade-illumination-altitude, hillshade-highlight-color and hillshade-shadow-color together describe light n.
• Requires maplibre-gl ≥ 5.5.0. Older runtimes reject hillshade-method. The docs site runs 6.x.
• Compare the single-light Add a hillshade layer. The source is the same kind of raster-dem; only the paint differs.