Анимация перехода маркера MapViewAnnotation через полилинию с помощью MapBox SDK для IOS ⇐ IOS

[Гость]

Я реализовал тривиальное решение для перемещения маркера по полилинии для использования MapBox SDK для IOS и Swift UI, и мне нужно сделать движение более плавным. У меня есть кнопка, которая запускает функцию для перебора координат и обновления текущего положения маркера, каждый раз, когда координата обновляется, маркер перемещается быстро, но мне нужен переход. Я попытался добавить анимацию() к элементу, который действует как маркер, но он не работает. Пожалуйста, посмотрите мой код и скажите, как я могу анимировать переход

Код: Выделить всё

import SwiftUI
@_spi(Experimental) import MapboxMaps

@available(iOS 14.0, *)
struct ContentView: View {
@State private var isAnimating = false
@State private var markerCoordinate: CLLocationCoordinate2D?
@State private var selected = false
@State private var allowOverlap: Bool = false

var body: some View {
ZStack {
Map(initialViewport: .camera(center: cord, zoom: 8)) {
// Route polyline
PolylineAnnotationGroup {
PolylineAnnotation(id: "route", lineCoordinates: routeCoordinates)
.lineColor("#57A9FB")
.lineWidth(10)
}
// Animated marker
if let markerCoordinate = markerCoordinate {
MapViewAnnotation(coordinate: markerCoordinate) { // Set coordinate to markerCoordinate
Text("🏠")
.frame(width: 22, height: 22)
.scaleEffect(selected ? 1.8 : 1)
.padding(selected ? 20 : 10)
.background(
Circle().fill(selected ? .red : .blue))
.animation(.spring(), value: selected)
.onTapGesture {
selected.toggle()
}
.onAppear {  // Add animation on appear
withAnimation(.easeInOut(duration: 1.0)) { // Adjust duration and
}
}
}
.allowOverlap(allowOverlap)
}
}
.ignoresSafeArea()

// Button to start animation
VStack {
Spacer()
Button(action: {  // Add Button action here
startAnimation()
}) {
Text("Start Animation")
.foregroundColor(.white)
.padding()
.background(Color.blue)
.cornerRadius(8)
}
.padding()
}
}
}

private func startAnimation() {
// Reset marker coordinate
markerCoordinate = nil

// Animate marker along the route
animateMarkerAlongRoute()
}

private func animateMarkerAlongRoute() {
guard !routeCoordinates.isEmpty else {
return
}

let duration: Double = 50.0 // Total duration of the animation in seconds
let stepDuration = duration / Double(routeCoordinates.count)

for (index, coordinate) in routeCoordinates.enumerated() {
DispatchQueue.main.asyncAfter(deadline: .now() + Double(index) * stepDuration) {
withAnimation(.easeInOut(duration: 0.5)) { // Adjust the duration and timing function as needed
markerCoordinate = coordinate
}
}
}
}

private let cord: CLLocationCoordinate2D = .init(latitude: 61.493343399275375, longitude: 21.79401104323395)

private let routeCoordinates: [CLLocationCoordinate2D] = [
.init(latitude: 61.493343399275375, longitude: 21.79401104323395),
.init(latitude: 61.369485877583685, longitude: 21.6497937188623),
.init(latitude: 61.20121331932606, longitude: 21.723373986398713),
.init(latitude: 61.15722935505474, longitude: 21.579156662028026),
.init(latitude: 61.1174491345069, longitude: 21.517349237298163),
.init(latitude: 61.03916342463762, longitude: 21.532065290804866),
.init(latitude: 60.922086661997184, longitude: 21.611531979743546),
.init(latitude: 60.82754056454698, longitude: 21.82049993954618),
.init(latitude: 60.662131116075585, longitude: 22.02063826724438),
.init(latitude: 60.543665503992116, longitude: 22.129538402396946),
.init(latitude: 60.461061119997595, longitude: 22.206061880634536),
.init(latitude: 60.4538050749446, longitude: 22.270812516066485)
]
}

@available(iOS 14.0, *)
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}

Источник: https://stackoverflow.com/questions/781 ... mapbox-sdk