Interactions

autk-map exposes three complementary interaction mechanisms. They share the same render-info flags and the same event bus, so they can be combined in any order:

1. Picking — pointer-driven selection that emits events through map.events.on().
2. Programmatic highlight and skip — direct control over which components stand out or are hidden, useful for cross-view coordination.
3. Layer visibility — show, hide, or fully remove an entire layer.

All examples below use projected Mercator data already prepared for the docs site, so each section focuses on a single interaction concern.

Picking

Enable picking on a layer with isPick and subscribe to MapEvent.PICKING through map.events.on(). The handler receives the picking payload for the current frame. Click on a feature to see the payload appear in the console.

Field	Description
layerId	The layer that produced the event. Layers without isPick: true never emit.
selection	Selected component ids in that layer. An empty array means the user clicked outside any pickable feature.

TIP

Picking works on the rendered geometry. For 3D buildings, picking hits the building footprint or its extruded surface depending on the layer type.

Highlight and skip

Besides pointer picking, autk-map lets you control the visible selection directly. This is the main hook for cross-view coordination: a chart, a filter, or any external state can push which components should stand out or be hidden.

• setHighlightedIds() emphasizes specific components while keeping them visible.
• setSkippedIds() hides specific components without removing the whole layer.
• clearHighlightedIds() and clearSkippedIds() reset those states.

Layer visibility

For layer-level visibility, use updateRenderInfo() with isSkip. To fully detach a layer from the map, call removeLayer(). The latter also frees its GPU resources.

Camera controls

After initializing the map and loading a layer, use resetCamera() to return to the default framing for the active render mode: flat-map framing or terrain bounds.

Run the example, then use its buttons to rotate/tilt the view or reset it. Navigation angles are expressed in radians.

map.camera extends the shared autk-core camera and exposes translation and zoom controls. With v4.1's default on-demand rendering, its navigation methods and supported map updates automatically request the next frame; there is no need to start a continuous render loop. camera.update() rebuilds matrices but does not itself request a frame. Prefer the navigation methods over directly mutating camera arrays.

See Initialization and lifecycle for hiding the floating map interface and cleaning up a map when its component is removed.