Skip to content

Map Control: add a compass that shows north and tilt, and resets the view on click - #578

Open
sandesh-sp wants to merge 4 commits into
developmentfrom
feature/576-map-control-compass
Open

sandesh-sp wants to merge 4 commits into
developmentfrom
feature/576-map-control-compass

Conversation

@sandesh-sp

Copy link
Copy Markdown
Collaborator

Closes #576.

Summary

  • Map camera on the bus. map:getViewState now includes bearing and pitch. deck.gl reads both from its camera. Leaflet always reports pitch 0 and reports the bearing its projection gives at the map centre, so polar maps show where north is.
  • map:resetNorth. On a rotated deck.gl view, it eases back to north and keeps the tilt. On a view that already faces north, it flattens the tilt. Leaflet can't rotate, so it returns false and leaves the view alone.
  • Compass button in Map Control. The button sits right after the zoom buttons, behind a Compass checkbox (showCompass) that is on by default. The needle turns against the bearing and tips with the pitch. It updates on map:moveend, and during map:move it reads the camera at most once per animation frame. Hovering shows the bearing and tilt, and clicking resets the view toward north.
  • Styling. The needle uses the bar's icon color through its rest, hover and active states. The south half is faded so north stands out. The glyph is drawn at 20px; the bar's other glyphs are 16px.

Test plan

  • npx vitest run: 211 files, 3,610 tests pass
  • deck.gl: rotate and tilt the map, and the needle follows the camera smoothly
  • Hover the compass to see the bearing and tilt; click it to ease back to north with the tilt kept, then click again to flatten
  • Unchecking Compass in the Map Control config removes the button
  • Leaflet: the compass shows north-up, and clicking it does nothing
  • The compass matches the other bar icons at rest, on hover and when active

@sandesh-sp
sandesh-sp changed the base branch from development to feature/570-float-bottom-offset October 15, 2026 21:37
@sandesh-sp
sandesh-sp force-pushed the feature/570-float-bottom-offset branch from 338b43a to a24c795 Compare October 16, 2026 13:26
map:getViewState carries the camera's bearing and pitch. deck.gl reads
them from its camera; Leaflet reports pitch 0 and the bearing its
projection gives at the map centre, so a polar map reports where north is.

map:resetNorth eases a rotated deck.gl view back to north while keeping
its tilt, and a north-up view back to flat. Leaflet cannot rotate, so it
returns false and leaves the view alone.
…view on click

A compass button beside the zoom buttons, behind a Compass checkbox that
is on by default. Its needle turns against the map's bearing and tips with
its tilt, following the camera on map:moveend and once per frame during
map:move. Hovering shows the bearing and tilt; clicking asks the map to
reset toward north.
Both halves of the needle take currentColor like the bar's other glyphs,
with the south half faded so north still reads first. The needle is drawn
at 20px against the other glyphs' 16px.
- deck.gl emits move on each basemap and side-by-side pane frame, so the
  needle follows gestures and the reset ease
- resetNorth turns the short way to the nearest whole turn, and in overlay
  mode decides from the live basemap camera
- Core provides map:getCamera and emits map:ready on each map init; the
  compass reads through them, at most once per frame
- getViewState leaves bearing and pitch null when the engine throws
- On an engine that cannot rotate the compass is an indicator, not a
  reset button
@sandesh-sp
sandesh-sp force-pushed the feature/576-map-control-compass branch from 53f87c0 to 1b14641 Compare October 20, 2026 14:17
@sandesh-sp
sandesh-sp changed the base branch from feature/570-float-bottom-offset to development October 20, 2026 14:17

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Map Control: add a compass that shows north and tilt, and resets the view on click

1 participant