Documentation

Map

The map stack is split across four packages. New integrations should use PlatformMap with WeatherLayers, which already mounts providers, events, and the layer overlay. The composed APIs below are for hosts that need to wire the stack themselves. See API request counts and token credits in the maps platform example.

Components

@infoplaza/platform/components

MapLibre shell, packaged weather stack, and control HUD.

import {
  PlatformMap,
  WeatherLayers,
  MapControlHud,
} from '@infoplaza/platform/components'

Also exported as types: PlatformMapProps, PlatformMapLoadPayload, WeatherLayersProps, MapControlHudProps, MapStyle, BaseMapStyle, MapStyleVariant.

PlatformMap

Weather-agnostic MapLibre shell.

The general map container. It mounts a MapLibre map, resolves the basemap style, and exposes map context (map instance, beforeId, style variant) through usePlatformMap() from @infoplaza/platform/providers. Weather is optional — add host layers as children, or mount WeatherLayers when you need forecast overlays.

import { PlatformMap } from '@infoplaza/platform/components'

Must wrap the map subtree. WeatherLayers and usePlatformMap() only work inside PlatformMap.
It is a forwardRef to the react-map-gl MapRef, so you can call map methods via ref.
Style resolution order: style (raw MapLibre URL/object) → mapStyle → mapStyleKey → first entry of mapStyles.
Call setWorkerUrl for MapLibre 6 before the first map mounts, or basemap tiles will not load.

Required props

Prop	Type	Default	Description
viewState	Record<string, unknown>	—	Camera state spread onto the MapLibre map. Pass at least longitude, latitude, and zoom. Typically controlled with onMove.

Optional props

Prop	Type	Default	Description
onMove	(event: unknown) => void	—	Fires while the camera moves. Use event.viewState to keep viewState in sync.
onClickMap	(event: unknown) => void	—	Fires when the map canvas is clicked.
onLoad	(payload: PlatformMapLoadPayload) => void	—	Fires once the map has loaded. Payload includes map, bounds, center, and zoom.
children	ReactNode \| ((props: { beforeId: string }) => ReactNode)	—	Map children, or a render prop that receives the resolved beforeId (the basemap layer weather should insert under).
mapStyleKey	string	—	Selects an entry from mapStyles by key. Built-in keys: 'dark', 'land', 'sea', 'traffic'.
mapStyles	MapStyle[]	MAP_STYLES	Available basemap styles. Pass [...MAP_STYLES, customStyle] to add your own.
mapStyle	BaseMapStyle	—	Explicit style object. Takes precedence over mapStyleKey. Kept mainly for backwards compatibility.
style	string \| object \| null	—	Raw MapLibre style URL or object. When set, it overrides mapStyle / mapStyleKey (escape hatch).
styleVariant	'default' \| 'marine'	'default'	Which variant of the selected style to use. When omitted, WeatherLayers / Providers can switch to marine for wave/ocean models via context.
fitBounds	LngLatBoundsLike	—	If set, the map fits these bounds on load and whenever the value changes.
fitBoundsOptions	{ padding?: number; maxZoom?: number; duration?: number }	{ padding: 48, maxZoom: 12, duration: 0 }	Options forwarded to map.fitBounds. Subsequent bound updates use duration 300 unless overridden.
ref	React.Ref<MapRef>	—	react-map-gl MapRef. Use getMap() for the underlying MapLibre instance, or call flyTo / fitBounds on the ref.

MapStyle

A named basemap option with default and marine variants. Import the type from @infoplaza/platform/defaults or @infoplaza/platform/components.

Fields

Name	Type	Default	Description
key	string	—	Unique id used by mapStyleKey.
title	string	—	Human-readable label (for a style picker).
styles.default.source	string \| object	—	MapLibre style URL or inline style object for land/atmospheric models.
styles.default.beforeId	string	—	Basemap layer id to insert weather under. Falls back to 'lakes-transparent' if omitted.
styles.marine.source	string \| object	—	Style used for marine models (category wave / ocean).
styles.marine.beforeId	string	—	beforeId for the marine variant. Built-in marine styles use landcover.

PlatformMapLoadPayload

Argument passed to onLoad.

Fields

Name	Type	Default	Description
map	maplibre-gl.Map	—	The loaded MapLibre map instance.
bounds	LngLatBounds	—	Current map bounds.
center	LngLat	—	Current map center.
zoom	number	—	Current zoom level.

Example

<PlatformMap
  viewState={viewState}
  onMove={(event) => setViewState(event.viewState)}
  mapStyleKey="dark"
>
  <WeatherLayers showHud />
</PlatformMap>

WeatherLayers

Packaged weather stack for use under PlatformMap.

Mounts Providers, map events, the Deck.gl layer pipeline (LayerComposer + LayerOverlay), and optionally MapControlHud. Use this instead of wiring Providers / MapEventsProvider / LayerComposer by hand unless you need a custom composition.

import { WeatherLayers } from '@infoplaza/platform/components'

Must be rendered as a child of PlatformMap. It calls usePlatformMap() for beforeId.
Fetches the models catalog internally via GET /api/platform/models. Mount PlatformAuth on your server.
Do not wrap PlatformMap in an outer Providers as well — Providers already lives inside WeatherLayers.
Toggle weather on a feature map by mounting or unmounting WeatherLayers.

Required props

None.

Optional props

Prop	Type	Default	Description
weatherConfig	WeatherConfig	{}	Initial weather selection. Omitted fields use packaged defaults (gfs / temperature / latest; member and level are inferred).
modelsConfig	ModelsConfig	—	Controls the internal models request. Set basePath if PlatformAuth is not mounted at /api/platform.
handler	'simple' \| 'demand' \| 'nowcast'	—	Map event handler. When omitted, the handler is chosen from the active model (nowcast, regional, or demand).
showHud	boolean	false	When true, renders MapControlHud (model / element / time / legend / zoom controls).
hudProps	MapControlHudProps	—	Props forwarded to MapControlHud when showHud is true.
interleaved	boolean	true	When true, weather layers are inserted into the MapLibre style under beforeId so labels and borders stay on top. When false, Deck.gl draws as an overlay on top of the map.
controller	boolean	true	Forwarded to the Deck.gl overlay. When true, the overlay participates in pointer interaction and picking.
mapIndex	number	0	Index of this map in a multi-map layout. Passed through to Providers and timestamps.
children	ReactNode	—	Extra content rendered inside Providers, alongside the overlay and HUD (for example host UI that needs weather context).

WeatherConfig

Initial weather selection passed to Providers.

Fields

Name	Type	Default	Description
model	string	'gfs'	Initial model slug.
element	string	'temperature'	Initial weather element.
run	string	'latest'	Initial model run.
member	string	—	Ensemble member. Inferred from the model when omitted.
level	string	—	Vertical level. Inferred from the element when omitted.
hideLayers	string[]	[]	Layer slugs to hide from the weather stack.
models	ModelInfo[]	—	Deprecated. Models are fetched internally. If provided, they take precedence over the fetched catalog.

ModelsConfig

Options for the internal GET ${basePath}/models request.

Fields

Name	Type	Default	Description
basePath	string	'/api/platform'	Public path where PlatformAuth is mounted. The models request is sent to ${basePath}/models.

Example

<PlatformMap
  viewState={viewState}
  onMove={(event) => setViewState(event.viewState)}
>
  <WeatherLayers
    showHud
    weatherConfig={{ model: 'optimal', element: 'temperature' }}
  />
</PlatformMap>

MapControlHud

Built-in map controls for model, element, time, legend, and zoom.

The control chrome that sits on top of the map: model / run / member pickers, element groups, timebar, legend, layer settings, info, and zoom. Prefer enabling it through WeatherLayers (showHud) unless you are composing the stack yourself.

import { MapControlHud } from '@infoplaza/platform/components'

Must be rendered inside Providers (WeatherMap context). WeatherLayers already provides that when showHud is true.
Layout is device-aware: mobile uses a compact layer control and MapControlMobileTimebar; desktop uses the full timebar and a vertical layer panel.
The timebar only renders for models whose format is forecast or nowcast.

Required props

None.

Optional props

Prop	Type	Default	Description
mapIndex	number	0	Which map the zoom control targets in a multi-map layout.
mapsLength	number	1	Total number of maps. Passed to the zoom control as multiMapCount.
isMultipleMapView	boolean	false	Compacts the HUD: smaller info, a shorter timebar, and a single visible element slot.

Example

<WeatherLayers
  showHud
  hudProps={{ mapIndex: 0, mapsLength: 1 }}
/>

// Composed stack (inside Providers, under PlatformMap):
<MapControlHud mapIndex={0} isMultipleMapView={false} />

Providers

@infoplaza/platform/providers

Context tree and hooks for map, models, weather selection, layer settings, and display flags. WeatherLayers mounts Providers for you.

import {
  Providers,
  useProviders,
  usePlatformMap,
  usePlatformMapContext,
  ModelsProvider,
  useModels,
  useModelsContext,
  WeatherMapProvider,
  useWeatherMap,
  LayerSettingsProvider,
  useLayerSettings,
  DisplaySettingsProvider,
  useDisplaySettings,
} from '@infoplaza/platform/providers'

Also exported: PlatformMapContext, ModelsContext, WeatherMapContext, and types PlatformMapContextValue, PlatformMapStyleVariantName.

Providers

Composed weather context tree for the map stack.

Mounts Redux timestamps, models fetch, weather state, legend values, layer settings, and display settings. WeatherLayers already includes this. Use Providers yourself only when composing LayerComposer / MapEventsProvider by hand.

import { Providers } from '@infoplaza/platform/providers'

When mounted under PlatformMap, Providers switches the basemap to the marine variant for wave/ocean models.
Do not wrap PlatformMap in Providers if you also use WeatherLayers — that would nest two provider trees.
Fetches GET {basePath}/models on mount. Mount PlatformAuth on your server.

Required props

Prop	Type	Default	Description
children	ReactNode	—	Map overlay, HUD, or other consumers of weather context.

Optional props

Prop	Type	Default	Description
weatherConfig	WeatherConfig	{}	Initial weather selection. Omitted fields use gfs / temperature / latest; member and level are inferred.
modelsConfig	ModelsConfig	—	Controls the internal models request. Set basePath if PlatformAuth is not mounted at /api/platform.
mapIndex	number	0	Index of this map in a multi-map layout. Passed to timestamp context.

Example

<PlatformMap viewState={viewState} onMove={onMove}>
  <Providers
    weatherConfig={{ model: 'optimal', element: 'temperature' }}
    mapIndex={0}
  >
    <MapEventsProvider>
      {(mapComponents) => (
        <LayerComposer beforeId={beforeId} mapComponents={mapComponents}>
          {({ layers }) => <LayerOverlay layers={layers} interleaved />}
        </LayerComposer>
      )}
    </MapEventsProvider>
    <MapControlHud />
  </Providers>
</PlatformMap>

useProviders

Reads every provider value in one call.

Convenience hook for composed hosts that need models, weather, legend, layer settings, display settings, and mapIndex together. Throws if any of those providers is missing.

import { useProviders } from '@infoplaza/platform/providers'

Must be used inside Providers (or WeatherLayers).

Arguments

None.

Returns

Name	Type	Default	Description
mapIndex	number	—	Active map index from MapIndexProvider.
models	ModelsContextValue	—	Same as useModels(): { models, loading, error }.
weather	WeatherContextValue	—	Same as useWeatherMap().
legend	{ legends, setLegends }	—	Legend values used by MapControlHud.
layerSettings	LayerSettingsContextValue	—	Same as useLayerSettings().
displaySettings	DisplaySettingsContextValue	—	Same as useDisplaySettings().

Example

const { weather, models, layerSettings } = useProviders()
if (models.loading) return null
return <span>{weather.model} · {models.models.length} models</span>

usePlatformMap

MapLibre instance and style context from PlatformMap.

Use this to add host sources/layers, call flyTo, or read the beforeId that weather layers insert under. Throws when used outside PlatformMap.

import { usePlatformMap } from '@infoplaza/platform/providers'

Must be used under PlatformMap. map is null until the MapLibre map has loaded.

Arguments

None.

Returns

Name	Type	Default	Description
map	maplibre-gl.Map \| null	—	The loaded MapLibre map, or null before onLoad.
beforeId	string	—	Basemap layer id weather should insert under. Falls back to lakes-transparent.
styleVariant	'default' \| 'marine'	—	Active style variant.
setStyleVariant	(variant: 'default' \| 'marine') => void	—	Switch variant. Providers already does this for marine models.

Example

function FlyToAmsterdam() {
  const { map } = usePlatformMap()
  return (
    <button
      type="button"
      disabled={!map}
      onClick={() => map?.flyTo({ center: [4.9041, 52.3676], zoom: 10 })}
    >
      Fly to Amsterdam
    </button>
  )
}

usePlatformMapContext

Nullable PlatformMap context.

Same value as usePlatformMap, but returns null outside PlatformMap instead of throwing. Used internally by Providers for marine style sync.

import { usePlatformMapContext } from '@infoplaza/platform/providers'

Arguments

None.

Returns

Name	Type	Default	Description
(return)	PlatformMapContextValue \| null	—	Map context, or null when there is no PlatformMap ancestor.

Example

const ctx = usePlatformMapContext()
ctx?.setStyleVariant('marine')

ModelsProvider

Fetches the weather models catalog.

Loads GET {basePath}/models once and exposes { models, loading, error }. Already mounted inside Providers. Use it directly only if you need the catalog without the rest of the weather tree.

import { ModelsProvider } from '@infoplaza/platform/providers'

Required props

Prop	Type	Default	Description
children	ReactNode	—	Consumers of useModels / useModelsContext.

Optional props

Prop	Type	Default	Description
basePath	string	'/api/platform'	Public path where PlatformAuth is mounted.

Example

<ModelsProvider basePath="/api/platform">
  <ModelCount />
</ModelsProvider>

useModels

Weather models catalog from ModelsProvider.

Throws outside ModelsProvider. Prefer this when the catalog is required; use useModelsContext when the component can render without it.

import { useModels } from '@infoplaza/platform/providers'

Arguments

None.

Returns

Name	Type	Default	Description
models	ModelInfo[]	—	Fetched catalog. Empty until the request succeeds.
loading	boolean	—	True while the models request is in flight.
error	Error \| null	—	Set when the models request fails.

Example

function ModelCount() {
  const { models, loading, error } = useModels()
  if (loading) return <span>Loading models…</span>
  if (error) return <span>Failed to load models</span>
  return <span>{models.length} models available</span>
}

useModelsContext

Nullable models catalog.

Same as useModels, but returns null outside ModelsProvider instead of throwing.

import { useModelsContext } from '@infoplaza/platform/providers'

Arguments

None.

Returns

Name	Type	Default	Description
(return)	ModelsContextValue \| null	—	{ models, loading, error }, or null outside ModelsProvider.

WeatherMapProvider

Weather selection state and derived layer info.

Holds the active model, element, run, member, and level, and derives modelInfo, elementInfo, and layersInfo. Reads the catalog from ModelsProvider unless weatherConfig.models is passed. Already mounted inside Providers.

import { WeatherMapProvider } from '@infoplaza/platform/providers'

Should sit under ModelsProvider so the catalog is available.
weatherConfig.models is deprecated; the fetched catalog takes over when it is omitted.

Required props

Prop	Type	Default	Description
children	ReactNode	—	HUD, events, and other weather consumers.

Optional props

Prop	Type	Default	Description
model	string	'gfs'	Initial model slug.
element	string	'temperature'	Initial weather element.
run	string	'latest'	Initial model run.
member	string	—	Ensemble member. Inferred from the model when omitted.
level	string	—	Vertical level. Inferred from the element when omitted.
hideLayers	string[]	[]	Layer slugs to hide from the weather stack.
models	ModelInfo[]	—	Deprecated. If provided, takes precedence over ModelsProvider.

Example

<ModelsProvider>
  <WeatherMapProvider model="optimal" element="wind">
    <MapControlHud />
  </WeatherMapProvider>
</ModelsProvider>

useWeatherMap

Current weather selection and derived layer info.

Throws outside WeatherMapProvider. Use this to read or change the active model, element, run, member, and level, or to inspect layersInfo for the HUD and event handlers.

import { useWeatherMap } from '@infoplaza/platform/providers'

Arguments

None.

Returns

Name	Type	Default	Description
model	string	—	Active model slug.
element	string	—	Active element slug.
modelRun	string	—	Active run (for example latest).
modelMember	string \| null	—	Active ensemble member.
modelLevel	string \| null	—	Active vertical level.
setModel / setElement / setModelRun / setModelMember / setModelLevel	function	—	Selection setters.
models	ModelInfo[]	—	Catalog used by this provider.
modelInfo	ModelInfo \| null	—	Resolved available model (may fall back if the slug is missing).
elementInfo	ElementInfo \| null	—	Active element, including layers and HUD options.
layersInfo	WeatherLayersInfo \| null	—	Resolved layer stack for the current selection.
hideLayers	string[]	—	Layer slugs hidden via config.

Example

const { model, setModel, elementInfo } = useWeatherMap()
setModel('gfs')

LayerSettingsProvider

Per-layer rendering settings (image, contours, particles, …).

Holds user-tunable settings for each rendering type and persists them to storage. LayerComposer reads getLayerState(layer) to decide what to draw. Already mounted inside Providers.

import { LayerSettingsProvider } from '@infoplaza/platform/providers'

Required props

Prop	Type	Default	Description
children	ReactNode	—	Layer composer, HUD layer panel, or other settings consumers.

Optional props

None.

Example

<LayerSettingsProvider>
  <LayerComposer mapComponents={mapComponents}>
    {({ layers }) => <LayerOverlay layers={layers} />}
  </LayerComposer>
</LayerSettingsProvider>

useLayerSettings

Read and write per-layer rendering settings.

Throws outside LayerSettingsProvider. Use getLayerState(layer) for the merged flat settings object that connectors consume. Per-bucket getters and setters (image, values, contour, …) write only that layer.

import { useLayerSettings } from '@infoplaza/platform/providers'

state and actions are the legacy global defaults, used for layers that have not been configured individually.
Settings persist in local storage (state-layer-settings-v1).

Arguments

None.

Returns

Name	Type	Default	Description
state	LayerSettingsState	—	Merged default + global settings (not per-layer).
actions	LegacyLayerActions	—	Global setters (image opacity, particle count, barb density, …).
getLayerState	(layer) => LayerSettingsState	—	Merged settings for a specific layer. Used by LayerComposer.
getImageState / setImageState / …	function	—	Per-bucket reads and writes for IMAGE_V2, VALUES, CONTOURS, CONTOURGEOJSON, DIRECTIONS, BARBS, and GRADES.

Example

const { getLayerState, setImageState } = useLayerSettings()
const settings = getLayerState(layer)
setImageState(layer, { imageOpacity: 0.8 })

DisplaySettingsProvider

HUD display flags (advanced layer settings, frame skip).

Persists advanceLayerSettings and frameSkip. LayerComposer uses frameSkip to keep the last valid timestamp visible while the next one loads. Already mounted inside Providers.

import { DisplaySettingsProvider } from '@infoplaza/platform/providers'

Required props

Prop	Type	Default	Description
children	ReactNode	—	Layer composer or HUD settings consumers.

Optional props

None.

useDisplaySettings

Read and write display flags.

Throws outside DisplaySettingsProvider.

import { useDisplaySettings } from '@infoplaza/platform/providers'

Arguments

None.

Returns

Name	Type	Default	Description
advanceLayerSettings	boolean	false	When true, the HUD shows advanced layer controls.
setAdvanceLayerSettings	(value: boolean) => void	—	Persist advanced layer settings.
frameSkip	boolean	false	When true, LayerComposer keeps showing the last loaded timestamp while the current one is missing.
setFrameSkip	(value: boolean) => void	—	Persist frame skip.
state	{ advanceLayerSettings, frameSkip }	—	Snapshot of both flags.

Layers

@infoplaza/platform/layers

Deck.gl pipeline: compose weather descriptors into layers, then overlay them on the MapLibre map.

import {
  LayerComposer,
  LayerOverlay,
} from '@infoplaza/platform/layers'

Overlay is an alias of LayerOverlay. Deep imports @infoplaza/platform/layers/composer and @infoplaza/platform/layers/overlay are also available.

LayerComposer

Turns weather map components into Deck.gl layers.

Reads mapComponents from MapEventsProvider, picks connectors by rendering type (IMAGE_V2, VALUES, PARTICLES, BARBS, DIRECTIONS, CONTOURS, CONTOURGEOJSON, RANGE, STORMTRACKS, PLOT, GRADES), and applies LayerSettingsProvider state. Pass the resulting layers to LayerOverlay. WeatherLayers already wires this.

import { LayerComposer } from '@infoplaza/platform/layers'

Must be rendered inside Providers (needs useLayerSettings, useDisplaySettings, and timestamp context).
beforeId should match PlatformMap / usePlatformMap().beforeId so labels stay above weather.
When frameSkip is on, the last valid timestamp and last rendered layers are kept while the next payload loads.

Required props

Prop	Type	Default	Description
children	(args: { layers: Layer[] }) => ReactNode	—	Render prop. layers is the Deck.gl layer list to pass to LayerOverlay.

Optional props

Prop	Type	Default	Description
mapComponents	Record<number, unknown[]>	—	Timestamp → layer descriptors from MapEventsProvider. When omitted or empty, no weather layers are produced (unless frameSkip keeps the previous list).
beforeId	string	—	MapLibre layer id forwarded to connectors so interleaved weather inserts under labels and borders.

Example

<MapEventsProvider>
  {(mapComponents) => (
    <LayerComposer beforeId={beforeId} mapComponents={mapComponents}>
      {({ layers }) => (
        <LayerOverlay layers={layers} interleaved beforeId={beforeId} />
      )}
    </LayerComposer>
  )}
</MapEventsProvider>

LayerOverlay

Deck.gl overlay on the MapLibre map.

Mounts a MapLibreOverlay with the layers from LayerComposer. When interleaved is true, weather is inserted into the basemap style under beforeId so place names stay on top. Overlay is the same component under another name.

import { LayerOverlay } from '@infoplaza/platform/layers'

Must be a child of PlatformMap (or any react-map-gl Map). It uses useMap / useControl.
import { Overlay } from "@infoplaza/platform/layers" is an alias of LayerOverlay.
Also exported from @infoplaza/platform/layers/overlay and @infoplaza/platform/layers/composer.

Required props

Prop	Type	Default	Description
layers	Layer[]	—	Deck.gl layers from LayerComposer (or your own).

Optional props

Prop	Type	Default	Description
interleaved	boolean	true	When true, layers are inserted into the MapLibre style. When false, Deck.gl draws on top of the map.
beforeId	string	—	MapLibre layer id to insert weather under. Required for correct interleaved order; if it cannot be resolved, interleaved layers are skipped rather than drawn above labels.
controller	boolean	—	Forwarded to the Deck.gl overlay. When true, the overlay participates in pointer interaction and picking.

Example

<LayerOverlay
  layers={layers}
  interleaved
  controller
  beforeId={beforeId}
/>

Events

@infoplaza/platform/events

Fetches weather layer payloads and textures for the current map view. MapEventsProvider picks a handler from the active model unless you override it.

import MapEventsProvider, {
  useEventHandlerType,
  DemandEventsProvider,
  SimpleEventsProvider,
  NowcastEventsProvider,
} from '@infoplaza/platform/events'
import type { EventHandlerType } from '@infoplaza/platform/events'

EventHandlerType is 'simple' | 'demand' | 'nowcast'.

MapEventsProvider

Fetches weather layer payloads and textures for the current view.

Chooses a handler (demand, simple, or nowcast) from the active model unless you pass handler, then loads layer URLs and textures keyed by timestamp. The render-prop argument is the mapComponents object LayerComposer expects. WeatherLayers already mounts this.

import MapEventsProvider from '@infoplaza/platform/events'

Must be inside Providers (weather + timestamps) and PlatformMap (MapLibre map).
Also available as a named export: import { MapEventsProvider } from "@infoplaza/platform/events".
Handler resolution when handler is omitted: nowcast models → nowcast; regional (non-global) models and observations → simple; global / nowcast-like types → demand; otherwise demand.

Required props

Prop	Type	Default	Description
children	(mapComponents: Record<number, unknown[]>) => ReactNode	—	Render prop. mapComponents maps unix timestamps to layer descriptors for LayerComposer.

Optional props

Prop	Type	Default	Description
handler	'simple' \| 'demand' \| 'nowcast'	—	Force a handler. When omitted, useEventHandlerType() picks one from the active model and element.

EventHandlerType

Handler ids exported from @infoplaza/platform/events.

Fields

Name	Type	Default	Description
demand	'demand'	—	Viewport-driven fetches, debounced on map move. Used for global models and several special types.
simple	'simple'	—	Fixed viewport URL, preloads all timestamps. Used for regional models and observations.
nowcast	'nowcast'	—	Nowcast texture pipeline with viewport-driven fetches on map move.

Example

<MapEventsProvider handler="demand">
  {(mapComponents) => (
    <LayerComposer beforeId={beforeId} mapComponents={mapComponents}>
      {({ layers }) => <LayerOverlay layers={layers} interleaved />}
    </LayerComposer>
  )}
</MapEventsProvider>

useEventHandlerType

Resolves which map event handler to use.

Returns the override if you pass one; otherwise inspects the active model (format, regionCategory) and element slug. Must be used inside WeatherMapProvider.

import { useEventHandlerType } from '@infoplaza/platform/events'

Optional arguments

Prop	Type	Default	Description
override	'simple' \| 'demand' \| 'nowcast'	—	Force this handler instead of resolving from the model.

Returns

Name	Type	Default	Description
(return)	'simple' \| 'demand' \| 'nowcast'	—	Handler id. Defaults to demand when no rule matches.

Example

const handler = useEventHandlerType()
const forced = useEventHandlerType('simple')

DemandEventsProvider

Viewport-driven forecast layer fetches.

Loads layer URLs from the current map bounds, debounced on move, then fetches forecast textures per timestamp. MapEventsProvider selects this for global models and several special types. Prefer MapEventsProvider unless you need to pin this handler.

import { DemandEventsProvider } from '@infoplaza/platform/events'

Must be inside Providers and a react-map-gl Map (uses useMap).
Same children render prop as MapEventsProvider. No handler prop — this is the handler.

Required props

Prop	Type	Default	Description
children	(mapComponents: Record<number, unknown[]>) => ReactNode	—	Same as MapEventsProvider children.

Optional props

None.

Example

<DemandEventsProvider>
  {(mapComponents) => (
    <LayerComposer mapComponents={mapComponents}>
      {({ layers }) => <LayerOverlay layers={layers} />}
    </LayerComposer>
  )}
</DemandEventsProvider>

SimpleEventsProvider

Fixed-viewport forecast fetches with full preload.

Builds layer URLs without tracking map move, and preloads all timestamps. MapEventsProvider selects this for regional (non-global) models and the observations element. Prefer MapEventsProvider unless you need to pin this handler.

import { SimpleEventsProvider } from '@infoplaza/platform/events'

Required props

Prop	Type	Default	Description
children	(mapComponents: Record<number, unknown[]>) => ReactNode	—	Same as MapEventsProvider children.

Optional props

None.

Example

<SimpleEventsProvider>
  {(mapComponents) => (
    <LayerComposer mapComponents={mapComponents}>
      {({ layers }) => <LayerOverlay layers={layers} />}
    </LayerComposer>
  )}
</SimpleEventsProvider>

NowcastEventsProvider

Viewport-driven nowcast texture pipeline.

Like demand, but uses the nowcast texture loader. MapEventsProvider selects this when the model format is nowcast. Prefer MapEventsProvider unless you need to pin this handler.

import { NowcastEventsProvider } from '@infoplaza/platform/events'

Must be inside Providers and a react-map-gl Map (uses useMap).

Required props

Prop	Type	Default	Description
children	(mapComponents: Record<number, unknown[]>) => ReactNode	—	Same as MapEventsProvider children.

Optional props

None.

Example

<NowcastEventsProvider>
  {(mapComponents) => (
    <LayerComposer mapComponents={mapComponents}>
      {({ layers }) => <LayerOverlay layers={layers} />}
    </LayerComposer>
  )}
</NowcastEventsProvider>

Deprecated

Still exported and supported, but not recommended for new integrations.

BaseMap

Deprecated

Weather-aware map shell. Prefer PlatformMap + WeatherLayers for new integrations.

A thin wrapper around PlatformMap that reads the active model from weather context and switches the basemap to the marine variant for wave/ocean models. It must be rendered inside Providers. Still supported for the hand-wired stack; new hosts should use PlatformMap with WeatherLayers instead.

import { BaseMap } from '@infoplaza/platform/components'

Deprecated. Use PlatformMap + WeatherLayers for new integrations.
Must be rendered inside Providers. It calls useWeatherMap() to resolve the marine style variant.
Does not accept styleVariant, onLoad, fitBounds, or fitBoundsOptions — those stay on PlatformMap.
Marine switching is automatic: model category wave or ocean uses the marine variant; everything else uses default.

Required props

Prop	Type	Default	Description
viewState	Record<string, unknown>	—	Camera state spread onto the MapLibre map. Same as PlatformMap.viewState.

Optional props

Prop	Type	Default	Description
onMove	(event: unknown) => void	—	Same as PlatformMap.onMove.
onClickMap	(event: unknown) => void	—	Same as PlatformMap.onClickMap.
children	ReactNode \| ((props: { beforeId: string }) => ReactNode)	—	Typically the composed weather stack: MapEventsProvider, LayerComposer, LayerOverlay, and MapControlHud. The render-prop form receives beforeId.
mapStyleKey	string	—	Same as PlatformMap.mapStyleKey.
mapStyles	MapStyle[]	MAP_STYLES	Same as PlatformMap.mapStyles.
mapStyle	BaseMapStyle	—	Same as PlatformMap.mapStyle.
style	string \| object \| null	—	Same as PlatformMap.style.

Example

<Providers>
  <BaseMap viewState={viewState} onMove={onMove} mapStyleKey="dark">
    {({ beforeId }) => (
      <>
        <MapEventsProvider>
          {(mapComponents) => (
            <LayerComposer beforeId={beforeId} mapComponents={mapComponents}>
              {({ layers }) => (
                <LayerOverlay layers={layers} interleaved controller />
              )}
            </LayerComposer>
          )}
        </MapEventsProvider>
        <MapControlHud />
      </>
    )}
  </BaseMap>
</Providers>