OptionalbeforeLayerConfig?: GeometryBeforeLayerConfigWhere the bands sit in the map's layer stack: a single target, or { all, fill, line } to
place the fill and the borders apart.
Optionalfill?: ReachableRangeFillConfigHow the bands are filled, and their colours.
Optionalhighlight?: GeometryHighlightConfigHow a hovered or clicked band is drawn.
Optionallayers?: GeometryLayersConfigMapLibre overrides for the band, border and label layers.
OptionallineLabel?: ReachableRangeLineLabelConfigThe text and look of the labels along each range's border.
Optionalvisible?: booleanWhether the module draws its bands, borders and their labels.
show() and clear() never change it. A hidden module keeps its ranges until
ReachableRangesModule.setVisible shows it again.
The bands take their colours from the map unless fill.palette
sets them. They ramp from the map's accent (innermost band) toward its land colour (outermost), reversed
for the 'inverted' fill style, both read from TomTomMap.mapColors. A theme set through StylingFoundationsModule.setMapColors, such as from
the map-theme plugin's deriveMapColors, recolours the bands with the rest of the map. Without one,
the ramp runs between the map style's own light or dark defaults, '#0A3653' toward white on light
styles and '#5FA8D8' toward '#333333' on dark ones, and follows a
switch between them.
// The area outside the 30-minute range dimmed, in your own colours
const config: ReachableRangesModuleConfig = {
fill: { style: 'inverted', palette: ['#e63312', '#f5a000', '#1d3f8a'] },
};
ReachableRangesModuleSerializableConfig for the part that survives JSON.
Configuration of the ReachableRangesModule.