SwiftUI Map MapPolyline not showing

Question

My intention is to display a SwiftUI.Map (doc) with a line (that would represent a route) using MapPolyline (see doc). Unfortunately, the line does not display on neither the simulator nor a physical device. Here's my code.

let deviceLocations = [
    // note: coordinates have be obfuscated for privacy reasons
    CLLocationCoordinate2D(latitude: 54.1234, longitude: -83.1234),
    CLLocationCoordinate2D(latitude: 54.1235, longitude: -83.1235),
    ... // there a more points in my hard-coded array, but you get the idea...
]

var body: some View {
    Map(initialPosition: .userLocation(fallback: .automatic),
        bounds: nil,
        interactionModes: .all) {
        MapPolyline(coordinates: deviceLocations)
            .stroke(lineWidth: 2.0)
    }
        .mapControlVisibility(.hidden)
}

That's it. The simulator location is set to "Custom Location" with one of the coordinate from the list. That View is part of a view with other elements on it, but are not shown here (within a ZStack).

I don't know what I'm missing, and the documentation does not address this deeply enough.

Answer 1

The Polyline still there. However, you can't see it because its content is empty. Try to fill with Color for example:

MapPolyline(coordinates: deviceLocations)
     .stroke(.blue, lineWidth: 2.0)

Or create custom ShapeStyle:

struct CustomShapeStyle: ShapeStyle {
    func resolve(in environment: EnvironmentValues) -> some ShapeStyle {
        if environment.colorScheme == .light {
            return Color.blue.blendMode(.lighten)
        } else {
            return Color.blue.blendMode(.darken)
        }
    }
}
...
MapPolyline(coordinates: deviceLocations)
     .stroke(CustomShapeStyle(), lineWidth: 2.0)