Function: useBoundaryToggle()
useBoundaryToggle(
baseSpec,groups):BoundaryToggleResult
Defined in: react/useBoundaryToggle.ts:54
Manages visibility state for a fixed set of BoundaryGroups over a base spec.
All groups start visible. The hook appends them once into spec and then
drives layer.visible via toggleBoundaryGroup — avoiding source
add/remove on each toggle (no map flicker).
Tracks hidden groups by stable source ID (getBoundaryGroupId) rather than
object reference. This allows groups to be recreated (e.g. when paint
overrides change) while preserving visibility state across renders.
Parameters
| Parameter | Type | Description |
|---|---|---|
baseSpec | VisualizationSpec | Spec without any boundary groups. |
groups | readonly BoundaryGroup[] | Ordered list of BoundaryGroups to manage. Must be stable across renders (module constants or memoised); changing the array reference re-appends all groups to the spec. |
Returns
Derived spec and toggle controls.
Example
const statesGroup = createBoundaryGroup({
id: 'brazil-states',
data: 'https://example.com/estados.geojson',
});
const { spec, toggle, isVisible } = useBoundaryToggle(baseSpec, [statesGroup]);
return (
<>
<GeoVisProvider spec={spec}><GeoVisCanvas /></GeoVisProvider>
<button onClick={() => toggle(statesGroup)}>
{isVisible(statesGroup) ? 'Hide states' : 'Show states'}
</button>
</>
);