Search

Search for a Location​

Examples

See the full example of Searching here: SearchLocation.swift

From here onwards, code for both Mapbox and Google Maps is similar.

Take a look at the following code. As discussed before, this will select a location named "Family Dining Room".

Task {
        do {
                // Load MapsIndoors with the MapsIndoors API key.
                try await MPMapsIndoors.shared.load(apiKey: YOUR_MAPSINDOORS_API_KEY)
                
                if let mapConfig = mapConfig {
                    if let mapControl = MPMapsIndoors.createMapControl(mapConfig: mapConfig) {
                        
                        // Retain the mapControl object
                        self.mpMapControl = mapControl
                        
                        let query = MPQuery()
                        let filter = MPFilter()
                        
                        query.query = "Family Dining Room"
                        filter.take = 1
                        
                        let locations = await MPMapsIndoors.shared.locationsWith(query: query, filter: filter)
                        if let firstLocation = locations.first {
                            mapControl.select(location: firstLocation, behavior: .default)
                            mapControl.select(floorIndex: firstLocation.floorIndex.intValue)
                            // set the origin as Family Dining room
                            origin = firstLocation
                        }
                    }
                }
                
            } catch {
                print("Error loading MapsIndoors: \(error.localizedDescription)")
        }
}

Our goal now is to enable the user to interact with a search bar and move the map with respect to their search. Therefore, we need to implement a bit more functionality into our ViewController class, so feel free to update it as followed.

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource, UISearchBarDelegate {
...
}

Let us start off by implementing the search bar. In this case, we add the following variables to our class. The vertical offset of the search bar here is simply to avoid the search bar from colliding with the navigation bar. The tableView will be used to allow the user to see and interact with the search results.

var searchResult:[MPLocation]?
lazy var destinationSearch:UISearchBar = UISearchBar(frame: CGRect.init(x: 0, y: 40, width: 0, height: 0))
var tableView = UITableView.init(frame: CGRect.init(x: 0, y: 90, width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height))

And let us also make sure the search bar delegated and correctly displayed in our view.

override func viewDidLoad(){
    destinationSearch.sizeToFit()
    self.destinationSearch.delegate = self
    self.view.addSubview(destinationSearch)
    tableView.dataSource = self
    tableView.delegate = self
    //...
}

Finally, let us add the functions neccessary for our class to conform to the UITableViewDataSource protocol and the actual search button functionality.

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return self.searchResult?.count ?? 0
}

func numberOfSections(in tableView: UITableView) -> Int {
    return 1
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = UITableViewCell()
    let location = self.searchResult?[indexPath.row]
    cell.textLabel?.text = location?.name ?? ""
    return cell
}

func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
    guard let location = searchResult?[indexPath.row] else { return }
        mpMapControl?.goTo(entity: location) // Use the retained mpMapControl object
        tableView.removeFromSuperview()
}

func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String) {
        view.addSubview(tableView)
        let query = MPQuery()
        let filter = MPFilter()
        query.query = searchText
        filter.take = 100
        Task {
            searchResult = await MPMapsIndoors.shared.locationsWith(query: query, filter: filter)
            tableView.reloadData()
        }
}

Here, the first 3 functions simply outline the appearence of the table. Namely, how many rows to show and which text to represent each entry.

The main functions of note in this case are, func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) and func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String).

The former denotes what to do once an item is selected, in this case we simply go to the specified location and hide the table view again, while the latter functions almost exactly the same as the initial simple search we included in Display a Map with MapsIndoors.

At this point we should have a functional map with a search feature.

Expected Result​

Last updated