Map Controller
A map controller provides the interface between your map view, which is created using a third-party mapping library such as Leaflet or Mapbox, and the functionality available within the MapsGL SDK. Therefore, you will be working with a map controller instance most of the time when managing data sources and layers or controlling the animation timeline.
To start working with your map, you'll need to create a map controller instance that corresponds to the mapping library you're using. Refer to the list of supported third-party mapping library that MapsGL currently integrates with to determine which map controller you need to instantiate as it is based on your chosen mapping library.
The following examples demonstrate how to set up a map controller using the supported mapping libraries:
import SwiftUI
import MapboxMaps
import MapsGLMaps
import MapsGLMapbox // Needed only if you are using SPM
//import MapsGL // Needed only if you are using CocoaPods
import Combine
let xweatherClientID = "FILL_IN_WITH_YOUR_CLIENT_ID"
let xweatherClientSecret = "FILL_IN_WITH_YOUR_CLIENT_SECRET"
let mapboxAccessToken = "FILL_IN_WITH_YOUR_MAPBOX_PUBLIC_ACCESS_TOKEN"
struct MyMapView : View {
class Coordinator {
/// MapsGL's controller that manages adding/removing MapsGL weather layers to/from the `MapboxMaps.MapView`.
var mapController: MapboxMapController!
/// Holds Combine subscriptions to MapsGL events and other Combine subscriptions.
var cancellables: Set<AnyCancellable> = []
}
private let coordinator = Coordinator()
var body: some View {
MapReader { proxy in
Map(initialViewport: .camera(
center: CLLocationCoordinate2D(latitude: 50.0, longitude: 10.0),
zoom: 2.5
))
.mapStyle(.dark)
.ignoresSafeArea()
.onAppear {
guard let map = proxy.map else { return }
try! map.setProjection(.init(name: .mercator)) // Set 2D map projection
// Set up the MapsGL `MapboxMapController`, which will handle
// adding/removing MapsGL weather layers to the `MapboxMaps.MapView`.
let mapController = MapboxMapController(
map: map,
window: UIWindow?.none,
account: XweatherAccount(id: xweatherClientID, secret: xweatherClientSecret)
)
coordinator.mapController = mapController
// Once the map has completed initial load…
mapController.subscribe(to: MapEvents.Load.self) { _ in
// Add the wind particles layer.
do {
var layerConfig = WeatherService.WindParticles(service: mapController.service)
layerConfig.layer.paint.particle.density = .extreme
try mapController.addWeatherLayer(config: layerConfig)
} catch {
NSLog("Failed to add weather layer: \(error)")
}
}.store(in: &coordinator.cancellables)
}
}
}
private static let _staticInit: Void = {
MapboxOptions.accessToken = mapboxAccessToken
}()
private let _staticInit: Void = Self._staticInit
}
#Preview {
MyMapView()
}
A full example of how to set up MapsGL with Mapbox with SwiftUI can be found in the mapsgl-apple-sdk repository's Demo directory (opens in a new tab), particularly in this content view (opens in a new tab).
Managing Map Data
With a map controller created, you can start adding data to your map. To do so, you can quickly add our pre-configured weather layers (opens in a new tab) to your map without needing to create the data sources and layers directly. Review our guide on using weather layers for more information.
Alternatively, for custom datasets you'll need to set up the appropriate data sources, layers and render styles (opens in a new tab) for your data and visualization requirements. You'll first want to start by adding data sources to your map, so review the data sources guide next for more information.
Map Controls
You can include additional controls to your map controller, such as a legend or real-time data inspector. These controls provide additional functionality related to the map and/or active data layers on the map.
Legend Control
Coming soon. Check out the development roadmap for more information.
Data Inspector Control
Coming soon. Check out the development roadmap for more information.