在Jetpack Compose Google Maps中实现多边形顶点拖拽功能咨询

完全可以在Jetpack Compose中实现你需要的功能，以下是修改后的完整代码及关键优化点：

关键改动说明： #

• 限制地图点击次数，仅当顶点数少于3时添加新顶点，满足3次点击后自动生成闭合多边形
• 使用mutableStateListOf存储顶点坐标，支持局部更新触发Compose重组，提升性能
• 为每个顶点标记绑定拖拽结束回调，实时同步标记位置与多边形顶点坐标
• 用rememberMarkerState关联每个顶点的标记状态，确保拖拽状态可追踪且在重组中保留

// 用mutableStateListOf存储顶点，支持局部更新触发重组
val geoPoints = remember { mutableStateListOf<LatLng>() }
// 存储每个顶点对应的MarkerState，追踪标记拖拽状态
val markerStates = remember { mutableStateListOf<MarkerState>() }

GoogleMap(
    mapGesturesEnabled = mapGesturesEnabled,
    onClick = { latLng ->
        // 限制最多添加3个顶点，达成后停止接收点击
        if (geoPoints.size < 3) {
            geoPoints.add(latLng)
            markerStates.add(rememberMarkerState(position = latLng))
        }
    },
    cameraPositionState = cameraPositionState,
    onMapLoaded = {
        isMapLoaded = true
        if (!cameraPositionState.isMoving) {
            cameraPositionState.projection?.let { onBoundsChange(it) }
        }
    },
    modifier = modifier
) {
    val context = LocalContext.current

    // 顶点数≥3时渲染多边形
    if (geoPoints.size >= 3) {
        Polygon(
            points = geoPoints,
            fillColor = Blue2.copy(alpha = 0.1f),
            strokeColor = Blue2,
            strokeWidth = 3f
        )
    }

    // 为每个顶点生成可拖拽标记
    geoPoints.forEachIndexed { index, _ ->
        Marker(
            state = markerStates[index],
            visible = true,
            icon = BitmapDescriptorFactory.fromBitmap(getBitmapFromImage(context, R.drawable.ic_marker_polygon)),
            draggable = true,
            onDragEnd = { newMarkerState ->
                // 更新对应位置的顶点坐标，触发多边形实时刷新
                geoPoints[index] = newMarkerState.position
            }
        )
    }
}

功能说明： #

• 用户点击地图3次后，系统自动生成闭合多边形
• 拖拽任意顶点标记时，多边形会跟随标记位置实时调整形状与大小
• 若需要支持更多顶点的多边形，只需移除onClick中的size <3限制即可

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