Map Rendering Issue: Blurry View After Viewport Update

[Hammad335]

Environment

• Xcode version: 16.1
• iOS version: 18.1
• Devices affected:
• Maps SDK Version: 11.8.0

Observed behavior and steps to reproduce

In my iOS app, users can search for a location and tap on any search result. Upon tapping, the map animates to center on the selected location by adjusting the viewport. However, sometimes after the animation completes, the map appears blurred even though the user is at the correct location. The blur disappears when the user interacts with the map, such as by zooming in or out.

Video Demonstration of Issue: In this video, I searched for multiple locations. Notice that when I search for and animate to 'Cuba', the map appears blurred after the animation. The blur disappears once I interact with the map.

https://github.com/user-attachments/assets/a0332196-4172-4310-b1e2-2d2fe8c94136

Code Snippet:

MapReader { _ in
            Map(viewport: $viewport)
            
                // MARK: - for places update camera
                .onChange(of: updateCoordinate) { _ in
                    if let coordinates = selectedCoordinates {
                        // Step 1: Zoom out and rotate the globe
                        withViewportAnimation(.easeInOut(duration: 1.5)) {
                            viewport = .camera(
                                center: CLLocationCoordinate2D(
                                    latitude: coordinates.latitude,
                                    longitude: coordinates.longitude
                                ), // Roughly set the direction
                                zoom: 2,
                                bearing: 0
                            )
                        }
                        // Roughly set the direction
                        // detach from the plane if the animation is in progress
                        DispatchQueue.main.asyncAfter(deadline: .now() + 1.5) {
                            withViewportAnimation(.easeInOut(duration: 2)) {
                                viewport = .camera(
                                    center: CLLocationCoordinate2D(
                                        latitude: coordinates.latitude,
                                        longitude: coordinates.longitude
                                    ),
                                    zoom: 12,
                                    bearing: 0
                                )
                            }
                        }
                    }
                }
        }

Expected behavior

Once the animation completes, the map should appear clear and sharp without requiring any user interaction.