Skip to main content
Version: 5.0

Interactivty

Using Mappedin SDK for iOS with your own map requires an Enterprise license. Try a demo map for free or refer to the Pricing page for more information.

The MPIMapClickDelegate protocol enables an app to receive an MPIMapClickEvent, which include the objects that were clicked. The MPIMapClickEvent includes the following properties, which describe the click event.

  • Floating Label
  • Map
  • Blue Dot
  • Path
  • Polygon
  • Position

In order to use MPIMapClickDelegate, it must be added to an MPIMapView.

mapView?.mapClickDelegate = self

Note: A complete class that uses the code snippets in this guide can be found in the Mappedin iOS Github repo: AddingInteractivityVC.swift

Floating Labels​

To allow floating labels to be clicked, they must be set to be interactive.

mapView?.floatingLabelManager.labelAllLocations(
    options: MPIOptions.FloatingLabelAllLocations(interactive: true))

When clicked, the MPIMapClickEvent provides an array of MPIMapClickEvent.FloatingLabelClicked of all floating labels that were clicked. The array contains the floating label's location as an MPINode and it's text as a String.

The code sample below checks if the floating label array is empty and if not, appends the text of the first floating label clicked to message.

func onClick(mapClickEvent: Mappedin.MPIMapClickEvent) {
    var message = ""
    if (!mapClickEvent.floatingLabels.isEmpty)  {
        message.append("Floating Label Clicked: ")
        message.append(mapClickEvent.floatingLabels.first?.text ?? "")
        message.append("\n")
    }
}

Maps​

MPIMapClickEvent includes an array of MPIMaps corresponding to every map that a user's click passed through. These are in order of first to last intersected. For example, if the user clicked on a map showing the second floor of a building, the second floor map would be first in the array followed by the first floor.

The code sample takes the first map in the array and stores the first map's name in a variable called title.

func onClick(mapClickEvent: Mappedin.MPIMapClickEvent) {
    let title = mapClickEvent.maps.first?.name ?? ""
}

Blue Dot​

MPIMapClickEvent contains a boolean value that is set to true if the user clicked on or near the Blue Dot representing their current location.

The code sample below demonstrates detecting if the user clicked near the Blue Dot.

func onClick(mapClickEvent: Mappedin.MPIMapClickEvent) {
    if (mapClickEvent.nearBlueDot) {
        // The user clicked near the Blue Dot.
    }
}

Paths​

MPIMapClickEvent includes a list of paths the user clicked on. Multiple paths are included if the user clicked on a junction where paths cross. These are in order of first to last intersected by the click point and will be empty if no paths were clicked.

When drawing a path, MPIOptions.Path must be used to enable a path to be clickable by setting interactive to true. This applies when using both MPIJourneyManager and MPIPathManager.

// Creating a clickable path using MPIJourneyManager
let journeyOpt = MPIOptions.Journey(pathOptions: MPIOptions.Path(interactive: true))
self.mapView?.journeyManager.draw(directions: directions, options: journeyOpt)

// Creating a clickable path using MPIPathManager
self.mapView?.pathManager.add(nodes: directions.path,
    options: MPIOptions.Path(interactive: true))

The code sample below detects if the user clicked on an interactive path.

func onClick(mapClickEvent: Mappedin.MPIMapClickEvent) {
    var message = ""
    if (!mapClickEvent.paths.isEmpty) {
        message.append("You clicked a path.\n")
    }
}

Polygons​

MPIMapClickEvent provides a list of MPINavigatable.MPIPolygons that the user's click event passes through. These are in order of first to last intersected and will be empty if no polygons were clicked.

The code sample below detects if a polygon was clicked and if it was, appends the location name of the polygon to message.

func onClick(mapClickEvent: Mappedin.MPIMapClickEvent) {
    var message = ""

    if (!mapClickEvent.polygons.isEmpty) {
        message.append("Polygon clicked: ")
        message.append(mapClickEvent.polygons.first?.locations?.first?.name ?? "")
        message.append("\n")
    }
}

Position / Coordinates​

MPIMapClickEvent can be used to determine the exact point on the map where the user clicked by observing the MPIMap.MPICoordinate it contains. The MPICoordinate's properties provide the x and y coordinates and latitude and longitude of the user's click.

The code sample below illustrates how to extract the MPICoordinate values from MPIMapClickEvent and append them to message.

func onClick(mapClickEvent: Mappedin.MPIMapClickEvent) {
    var message = ""
    message.append("Coordinate Clicked: \nLatitude: ")
    message.append(mapClickEvent.position?.latitude.description ?? "")
    message.append("\nLongitude: ")
    message.append(mapClickEvent.position?.longitude.description ?? "")
}

Note: A complete class that uses the code snippets in this guide can be found in the Mappedin iOS Github repo: AddingInteractivityVC.swift