如何在Google Maps Compose中自动调整缩放以显示所有标记？

Google Maps Compose 提供的 cameraPositionState 可以轻松适配单个位置，示例代码如下：

val singapore = LatLng(1.35, 103.87)
val cameraPositionState = rememberCameraPositionState {
    position = CameraPosition.fromLatLngZoom(singapore, 10f)
}
GoogleMap(
    modifier = Modifier.fillMaxSize(),
    cameraPositionState = cameraPositionState
)

如果要让地图初始化时自动显示所有位置标记，核心是计算所有位置的边界范围（LatLngBounds），再让相机自动缩放适配这个范围。具体实现步骤如下：

1. 定义位置列表 #

先准备好需要展示的所有位置：

val locations = listOf(
    LatLng(1.35, 103.87),
    LatLng(1.28, 103.82),
    LatLng(1.40, 103.90)
)

2. 计算位置边界 #

通过 LatLngBounds.Builder 把所有位置包含进去，生成边界对象：

val bounds = remember(locations) {
    if (locations.isEmpty()) {
        // 空列表时设置默认边界，比如回到新加坡
        LatLngBounds(LatLng(1.35, 103.87), LatLng(1.35, 103.87))
    } else {
        val builder = LatLngBounds.builder()
        locations.forEach { builder.include(it) }
        builder.build()
    }
}

3. 让相机适配边界范围 #

使用 LaunchedEffect 监听边界变化，调用 CameraUpdateFactory.newLatLngBounds 让地图自动调整缩放和位置，同时设置 padding 避免标记被UI遮挡：

val cameraPositionState = rememberCameraPositionState()

LaunchedEffect(bounds) {
    if (locations.isNotEmpty()) {
        // 转换dp为px，设置padding避免标记被顶部/底部UI挡住
        val padding = with(LocalDensity.current) { 16.dp.toPx().toInt() }
        cameraPositionState.move(CameraUpdateFactory.newLatLngBounds(bounds, padding))
    }
}

4. 渲染地图和标记 #

最后在 GoogleMap 组件中添加所有位置标记：

GoogleMap(
    modifier = Modifier.fillMaxSize(),
    cameraPositionState = cameraPositionState
) {
    locations.forEach { location ->
        Marker(
            position = location,
            title = "位置标记"
        )
    }
}

补充说明 #

• 如果位置列表是动态加载的，remember(locations) 会保证只有列表变化时才重新计算边界
• padding 值可以根据你的实际UI布局调整，也可以用 newLatLngBounds 的重载方法设置上下左右不同的padding
• 空列表的情况可以根据需求设置默认的相机位置，避免地图显示空白区域

内容的提问来源于stack exchange，提问作者Mohamed Wasiq