Control the camera

The camera defines the visible part of the map: a target position, a zoom level, a bearing, and a tilt. rememberCameraState creates a CameraState that reads and writes the camera. Pass an initial CameraPosition to set the camera position at startup:

App.kt

val camera =
  rememberCameraState(
    firstPosition =
      CameraPosition(target = Position(latitude = 45.521, longitude = -122.675), zoom = 13.0)
  )
MaplibreMap(cameraState = camera)

Animate the camera

CameraState.animateTo is a suspend function that moves the camera to a new position over a duration. Call it from a coroutine:

App.kt

LaunchedEffect(Unit) {
  camera.animateTo(
    finalPosition =
      camera.position.copy(target = Position(latitude = 47.607, longitude = -122.342)),
    duration = 3.seconds,
  )
}

To move the camera without an animation, assign CameraState.position.

Fit a bounding box

An animateTo overload accepts a BoundingBox and moves the camera to the position that fits it. Padding adds space between the box and the edges of the map:

App.kt

LaunchedEffect(Unit) {
  camera.animateTo(
    boundingBox = BoundingBox(west = -123.0, south = 47.0, east = -122.0, north = 48.0),
    padding = PaddingValues(32.dp),
  )
}

CameraState.jumpTo fits the same bounding box without an animation.

Read the visible area

CameraState.viewport reports the current state of the rendered map: the size of the map composable, the visible bounding box, and the visible region. It is null until the map renders its first frame. A composition that reads it recomposes when the camera moves or the map resizes:

App.kt

val viewport = camera.viewport
if (viewport != null) {
  Text("Visible bounds: ${viewport.visibleBoundingBox}")
}

Convert between screen and geographic coordinates

CameraState.screenLocationFromPosition converts a geographic position to an offset from the top-left corner of the map composable. CameraState.positionFromScreenLocation converts in the other direction:

App.kt

if (camera.viewport != null) {
  val screenOffset = camera.screenLocationFromPosition(camera.position.target)
  val geoPosition = camera.positionFromScreenLocation(DpOffset(x = 100.dp, y = 150.dp))
}