Model animation shows jerky movement

[programmer443]

Environment

• Xcode version: 15.3
• iOS version: 17.4
• Devices affected:
• Maps SDK Version: 11.4.0

Observed behavior and steps to reproduce

When animating the position of a 3D model in Mapbox iOS, the model exhibits jerky movements during translation. The jerky movement is especially noticeable when the model is translating from one position to another. I have tried adjusting the modelTranslationTransition and modelRotationTransition, but the issue persists.

Code for adding model

let plane = Bundle.main.url(
    forResource: "A320",
    withExtension: "glb")!.absoluteString
var source = GeoJSONSource(id: "source-id")
source.maxzoom = 4
try? mapProxy?.map!.addStyleModel(modelId: "model-id-plane", modelUri: plane)
var planeFeature = Feature(geometry: Point(CLLocationCoordinate2D(latitude: 42.97330, longitude: -75.085930)))
planeFeature.properties = ["model-id-key": .string("model-id-plane")]
source.data = .featureCollection(FeatureCollection(features: [planeFeature]))
try? mapProxy?.map!.addSource(source)
var layer = ModelLayer(id: "model-layer-id", source: "source-id")
layer.modelId = .expression(Exp(.get) { "model-id-key" })
layer.modelType = .constant(.common3d)
layer.modelScale = .constant([1, 1, 1])
layer.modelTranslation = .constant([0, 0,  9753.60])
layer.modelRotation = .constant([0, 0, 186])
layer.maxZoom = 23
layer.minZoom = 5
layer.modelRotationTransition = StyleTransition(duration: 0.1, delay: 0.1)
layer.modelTranslationTransition = StyleTransition(duration: 0, delay: 0)
layer.modelCutoffFadeRange = .constant(0.0)
try? mapProxy?.map!.addLayer(layer)

Code for setting camera:

let freeCam = self.mapProxy?.map?.freeCameraOptions          
freeCam?.altitude = 10253.6
freeCam?.location = CLLocationCoordinate2D(latitude: 42.97330, longitude: -75.085930)
freeCam?.setPitchBearingForPitch(0, bearing: 276)
mapProxy?.map?.freeCameraOptions = freeCam!

Code for updating model location:

func updateModelPositionByTraslation(lat: Double, lng: Double, alt: Double, head: Double) {
    try? mapProxy?.map?.updateLayer(withId: MapViewLabels.layerId, type: ModelLayer.self) { layer in
        // Update layer properties
        layer.modelTranslation = .constant([0, 0, alt])
        layer.modelRotation = .constant([0, 0, 186])
    }

     let point = Point(CLLocationCoordinate2D(latitude: lat, longitude: lng))
     var pointFeature = Feature(geometry: point)
     pointFeature.properties = [MapViewLabels.modelKey: .string(MapViewLabels.modelID)]
     self.mapProxy?.map?.updateGeoJSONSource(withId: MapViewLabels.sourceID, geoJSON: .feature(pointFeature))

}

Expected behavior

The model should move smoothly without noticeable jerks.

Additional links and references

https://github.com/mapbox/mapbox-maps-ios/assets/82497041/ce16304e-ab74-4161-9895-7ede8e8d049e

[qandeelcc]

@astojilj @pjleonard37 Is this a limitation? I am assuming the source's property can't be updated smoothly, am I correct? Thanks!