Work with location search
Add location search functionality on a map
First, make sure you've provisioned a search index resource and configured your app using the instructions in either Configure Location Search or Use existing Amazon Location Service resources and you have already setup displaying a map in your application.
To add a location search UI component to your AMLMapView
, you will add an AMLSearchBar
to your View in your desired layout. Upon searching, Geo.Place
s are converted to MGLPointFeature
s using AmplifyMapLibre.createFeatures(places)
. Lastly assign those converted MGLPointFeature
s to mapState.features
. Alternatively, you can leverage the AMLMapCompositeView
directly, which includes an AMLSearchBar
among other pre-configured UI components.
1import SwiftUI2import AmplifyMapLibreUI3import AmplifyMapLibreAdapter4import Amplify5
6struct MyMapView: View {7
8 @StateObject private var mapState = AMLMapViewState()9 @State private var searchText = ""10 @State private var displayState: AMLSearchBar.DisplayState = .map11
12 var body: some View {13 ZStack(alignment: .top) {14 AMLMapView(mapState: mapState)15 .edgesIgnoringSafeArea(.all)16
17 AMLSearchBar(18 text: $searchText,19 displayState: $displayState,20 onCommit: search,21 onCancel: { mapState.features = [] }22 )23 .padding()24 }25 }26
27 private func search() {28 let searchArea = Geo.SearchArea.near(mapState.center)29 let searchOptions = Geo.SearchForTextOptions(area: searchArea)30 Amplify.Geo.search(for: searchText, options: searchOptions) { result in31 switch result {32 case .success(let places):33 DispatchQueue.main.async {34 mapState.features = AmplifyMapLibre.createFeatures(places)35 }36 case .failure(let geoError):37 print(geoError)38 }39 }40 }41}
Customize Feature Icons
You can customize the feature images displayed on the AMLMapView
or AMLMapCompositeView
, you can leverage the featureImage()
view modifier.
1var body: some View {2 AMLMapView(mapState: mapState)3 .featureImage {4 let image = UIImage(5 systemName: "paperplane.circle.fill",6 withConfiguration: UIImage.SymbolConfiguration(7 font: .systemFont(ofSize: 22, weight: .medium)8 )9 )!10 return image11 }12 .edgesIgnoringSafeArea(.all)13 }
Location-based search capabilities
Amplify Geo enables you to search for locations by text, addresses, or geo-coordinates.
Search for text
The Amplify.Geo.search(for text:)
API enables you to search for places or points of interest by free-form text, such as an address, name, city, or region.
1Amplify.Geo.search(for: "coffee shops") { result in2 switch result {3 case .failure(let error):4 print(error)5 case .success(let places):6 dump(places)7 }8}
You can refine your search by specifying following parameters inside Geo.SearchForTextOptions
area
.near
- to act as the search origination location..within
- to limit the area to search within.
countries
- to limit the search results to given countries.maxResults
- to limit the maximum result set (defaults to 50).
1let coordinates = Geo.Coordinates(latitude: 47.62246, longitude: -122.336775)2let options = Geo.SearchForTextOptions(area: .near(coordinates),3 countries: [.usa, .can],4 maxResults: 25)5 6Amplify.Geo.search(for: "coffee shops", options: options) { result in7 switch result {8 case .failure(let error):9 print(error)10 case .success(let places):11 dump(places)12 }13}
Search for coordinates
The Amplify.Geo.search(for coordinates:)
API is a reverse Geocoder that takes a coordinate point and returns information about what it finds at that point on the map.
1Amplify.Geo.search(for: coordinates) { result in2 switch result {3 case .failure(let error):4 print(error)5 case .success(let places):6 dump(places)7 }8}
You can refine your search by specifying following parameters inside Geo.SearchForCoordinatesOptions
maxResults
- to limit the maximum result set (defaults to 50)
1let options = Geo.SearchForCoordinatesOptions(maxResults: 25)