MapLibre Native iOS

MapLibre Native renders the full vector outdoor style natively on iOS with hardware acceleration, including 3D terrain.

Full working example (UIKit): github.com/mapriot/map-examples/MaplibreNativeIosUIKit — complete Xcode project with API key management, custom attribution button, and proper apiKey injection.


Installation

Swift Package Manager — add to Package.swift or in Xcode via File → Add Package Dependencies:

https://github.com/maplibre/maplibre-gl-native-distribution

Or via CocoaPods:

pod 'MapLibre'

Basic map (UIKit)

import UIKit
import MapLibre

class MapViewController: UIViewController, MLNMapViewDelegate {

    var mapView: MLNMapView!

    override func viewDidLoad() {
        super.viewDidLoad()

        let apiKey = "YOUR_API_KEY"
        let styleURL = URL(string: "https://api.mapriot.com/styles/outdoor.json?apiKey=\(apiKey)")!

        mapView = MLNMapView(frame: view.bounds, styleURL: styleURL)
        mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        mapView.delegate = self
        mapView.setCenter(
            CLLocationCoordinate2D(latitude: 50.08, longitude: 14.42),
            zoomLevel: 13,
            animated: false
        )

        view.addSubview(mapView)
    }
}

API key injection

The style JSON references tile, font, and sprite URLs on api.mapriot.com. Each subrequest also needs your API key. On iOS, you can use a URLProtocol interceptor (similar to transformRequest in MapLibre GL JS) that appends ?apiKey= to all requests to api.mapriot.com.

See the full implementation in the map-examples UIKit project which includes a complete KeyManager and URL interceptor setup.


SwiftUI

import SwiftUI
import MapLibre

struct MapLibreView: UIViewRepresentable {
    let apiKey: String

    func makeUIView(context: Context) -> MLNMapView {
        let styleURL = URL(string: "https://api.mapriot.com/styles/outdoor.json?apiKey=\(apiKey)")!
        let mapView = MLNMapView(frame: .zero, styleURL: styleURL)
        mapView.setCenter(
            CLLocationCoordinate2D(latitude: 50.08, longitude: 14.42),
            zoomLevel: 13,
            animated: false
        )
        return mapView
    }

    func updateUIView(_ uiView: MLNMapView, context: Context) {}
}

struct ContentView: View {
    var body: some View {
        MapLibreView(apiKey: "YOUR_API_KEY")
            .ignoresSafeArea()
    }
}

User location

mapView.showsUserLocation = true
mapView.userTrackingMode = .follow

Attribution

Include MapRiot and OSM attribution as required by the Terms of Service and OpenStreetMap license. The map-examples UIKit project demonstrates a custom attribution button that opens an action sheet with proper links to both copyright pages.