How do I add pins and other annotations to the new SwiftUI Map view for iOS 14

I'm still confused after reading the documentation about how to complete the annotationItems and annotationContent parameters of the Map view for iOS 14.

Accepted Reply

This is a simple example of showing pins in a Map.
Code Block
import SwiftUI
import MapKit
struct MyAnnotationItem: Identifiable {
    var coordinate: CLLocationCoordinate2D
    let id = UUID()
}
struct ContentView: View {
    @State var coordinateRegion: MKCoordinateRegion = {
        var newRegion = MKCoordinateRegion()
        newRegion.center.latitude = 37.786996
        newRegion.center.longitude = -122.440100
        newRegion.span.latitudeDelta = 0.2
        newRegion.span.longitudeDelta = 0.2
        return newRegion
    }()
    var annotationItems: [MyAnnotationItem] = [
        MyAnnotationItem(coordinate: CLLocationCoordinate2D(latitude: 37.810000, longitude: -122.477450)),
        MyAnnotationItem(coordinate: CLLocationCoordinate2D(latitude: 37.786996, longitude: -122.419281)),
    ]
    var body: some View {
        VStack {
            Text("Hello, world!").padding()
            Map(coordinateRegion: $coordinateRegion,
                annotationItems: annotationItems) {item in
                MapPin(coordinate: item.coordinate)
            }
        }
    }
}


But I cannot find how to put multiple types of annotations in a Map. (Showing Overlays, neither.)
Maybe that is one of the not-yet features...

Replies

This is a simple example of showing pins in a Map.
Code Block
import SwiftUI
import MapKit
struct MyAnnotationItem: Identifiable {
    var coordinate: CLLocationCoordinate2D
    let id = UUID()
}
struct ContentView: View {
    @State var coordinateRegion: MKCoordinateRegion = {
        var newRegion = MKCoordinateRegion()
        newRegion.center.latitude = 37.786996
        newRegion.center.longitude = -122.440100
        newRegion.span.latitudeDelta = 0.2
        newRegion.span.longitudeDelta = 0.2
        return newRegion
    }()
    var annotationItems: [MyAnnotationItem] = [
        MyAnnotationItem(coordinate: CLLocationCoordinate2D(latitude: 37.810000, longitude: -122.477450)),
        MyAnnotationItem(coordinate: CLLocationCoordinate2D(latitude: 37.786996, longitude: -122.419281)),
    ]
    var body: some View {
        VStack {
            Text("Hello, world!").padding()
            Map(coordinateRegion: $coordinateRegion,
                annotationItems: annotationItems) {item in
                MapPin(coordinate: item.coordinate)
            }
        }
    }
}


But I cannot find how to put multiple types of annotations in a Map. (Showing Overlays, neither.)
Maybe that is one of the not-yet features...
how do I place map pins without hardcoding them inside this struct?
  • Did u manage to solve it? Im struggling at this now. Pls share senpai

  • Also wondering about solution, would really appreciate any advice. Is there a way to add ping via Long Gesture while using SwiftUI's Map View? Or going for UIViewRepresentable for UIKit MapView is the only option for that kind of thing? Thanks in advance.

Add a Comment