Skip to content

📍 MapMetrics iOS Map Features Guide

This guide covers how to:

Add interactive markers

🔧 Prerequisites

Xcode installed (version 13 or newer recommended) A new or existing iOS project Add MapMetrics SDK to your project (via SPM or manual integration)

Example via Swift Package Manager:

: https://github.com/MapMetrics/MapMetrics-iOS

Setting Up the Map

In your ViewController.swift:

swift
class ViewController: UIViewController, MLNMapViewDelegate {
    var mapView: MLNMapView!
    var selectedAnnotation: MLNPointAnnotation?
    var isMarkerSelected = false

    override func viewDidLoad() {
        super.viewDidLoad()

        mapView = MLNMapView(
            frame: view.bounds,
            styleURL: URL(string: "<YOUR_STYLE_URL_HERE>")
        )
        mapView.delegate = self
        view.addSubview(mapView)
                mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        mapView.delegate = self
        
        // This is a better starting position 
        let center = CLLocationCoordinate2D(latitude: 20.0, longitude: 0.0) // More centered globally
        mapView.setCenter(center, zoomLevel: 2, animated: false) // Lower zoom to see more area
        view.addSubview(mapView)

    }
}

Add Tap-to-Drop Marker with Editable Title

swift
override func viewDidLoad() {
    ...
    let tapGesture = UITapGestureRecognizer(target: self, action: #selector(mapTapped(_:)))
    mapView.addGestureRecognizer(tapGesture)
}

@objc func mapTapped(_ sender: UITapGestureRecognizer) {
    let location = sender.location(in: mapView)
    let coordinate = mapView.convert(location, toCoordinateFrom: mapView)

    let marker = MLNPointAnnotation()
    marker.coordinate = coordinate
    marker.title = "Tap to add a name"
    mapView.addAnnotation(marker)
}

Add support for selecting and editing markers:

swift
func mapView(_ mapView: MLNMapView, didSelect annotation: MLNAnnotation) {
    guard let point = annotation as? MLNPointAnnotation else { return }
    selectedAnnotation = point
}

// Handle tap gesture on the map
@objc func mapTapped(_ sender: UITapGestureRecognizer) {
    // Only add a marker if no marker is currently selected
    guard !isMarkerSelected else { return }

    let location = sender.location(in: mapView)
    let coordinates = mapView.convert(location, toCoordinateFrom: mapView)
    addMarker(at: coordinates)
}
// Add marker to the map at specific coordinates
func addMarker(at coordinates: CLLocationCoordinate2D) {
    let marker = MLNPointAnnotation()
    marker.coordinate = coordinates
    marker.title = "Tap to add a name"  // Default title

    // Add the marker to the map
    mapView.addAnnotation(marker)
}
// Handle deselecting a marker (hide info view)
func mapView(_ mapView: MLNMapView, didDeselect annotation: MLNAnnotation) {
    if annotation === selectedAnnotation {
        isMarkerSelected = false
        selectedAnnotation = nil
    }
}
// MARK: - UITextFieldDelegate
extension ViewController: UITextFieldDelegate {

    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
        // When the user presses "done", update the marker's title with the text entered
        if let selectedAnnotation = selectedAnnotation, let newName = textField.text, !newName.isEmpty {
            selectedAnnotation.title = newName
        }

        return true
    }
}