Skip to content

Layer List

Toggles layer visibility and opacity. Layers are shown in the order declared in app/layers.ts, grouped by their group field.

  • id: layer-list
  • Surfaces: left-panel

Place it

leftPanelWidgets: [{ widgetName: 'layer-list' }],

Behavior

  • Visibility — each layer has an eye (or checkbox) toggle. With rowClickToggle on (the default), clicking anywhere on a layer's row toggles it.
  • Opacity — an opacity-slider button per row.
  • Labels — a labels on/off button, shown only on layers that declare a label config.
  • Groups — layers sharing a group name fold under a collapsible header with a master visibility toggle (showing an indeterminate state when only some children are visible).
  • Zoom awareness — a layer's name is grayed when the current zoom is outside its minZoom/maxZoom range.

All visibility/opacity edits persist across basemap switches.

Configuration

Defaults come from ui.layerList:

ui: {
  layerList: {
    groupsCollapsedByDefault: true,
    toggleStyle: 'eye',          // or 'checkbox'
    actions: { opacity: true, labels: true },
    rowClickToggle: true,
  },
},

Per-group collapse defaults via the top-level layerGroups block, and per-layer action overrides via a layer's actions field.