I am developing a canoe trip planning and tracking application, and I would like to track the progress on the map with a Polyline that follows my device's location. Here is the code I have so far:
var polylineTest by mutableStateOf<ArrayList<LatLng>>(arrayListOf())
GoogleMap(
properties = MapProperties(isMyLocationEnabled = true),
cameraPositionState = cameraPositionState,
modifier = Modifier
.padding(
bottom = padding.calculateBottomPadding(),
),
onMapLongClick = { loc ->
viewModel.onEvent(MapViewEvent.OnMapLongClick(loc))
},
uiSettings = uiSettings,
) {
viewModel.getSpotsFromDB(ongoing = true, viewModel.currentDayID).forEach() { spot ->
Log.i("MapViewScreen", "dayID: ${viewModel.currentDayID}, spot: $spot")
Marker(
state = MarkerState(
position = LatLng(spot.Latitude, spot.Longitude)
),
title = spot.Name,
snippet = spot.Description,
onInfoWindowClick = {
viewModel.onEvent(MapViewEvent.OnSpotClick(spot.ID!!))
}
)
}
Log.i("MapViewScreen", "points: ${viewModel.polylineTest}")
Polyline(points = viewModel.polylineTest)
}
What could I be doing wrong here? If more info needed I'll provide of course. Kind regards
I know for sure that the polylineTest
variable changes correctly because the Log message correctly shows the ArrayList getting bigger with every location update.
My problem is that I cannot see anything change on the map itself immediately, no polyline is being drawn as my location changes, but when I long click the map to add a spot, and go back, it renders the polyline.
If I call the Polyline composable with a static list of LatLngs it does show up on the map correctly, but not if I call it with viewModel.polylineTest
.
How could I make it so the polyline is being drawn immediately as the location changes? Also preferably I'd like it to not draw over the existing polyline. I'm open to suggestions because I am kinda lost :D