Animate Map Style Layer
This example shows how to animate runtime map style layer.
-
Add Image Source layer
-
Update Image source every second

For all code examples, refer to Maps Code Examples
AnimateMapLayerViewController view source
1//
2// AnimateMapLayerViewController.swift
3// maps-ios-demo
4//
5//
6import Foundation
7import UIKit
8import Nbmap
9class AnimateMapLayerViewController: UIViewController {
10
11 var nbMapView: NGLMapView! {
12 didSet {
13 oldValue?.removeFromSuperview()
14 if let mapView = nbMapView {
15 view.insertSubview(mapView, at: 0)
16 mapView.delegate = self
17 }
18 }
19 }
20 var radarSuffix = 0
21
22 var points : Array = [CLLocationCoordinate2D]()
23
24 override func viewDidLoad() {
25 super.viewDidLoad()
26 nbMapView = NGLMapView(frame:self.view.bounds)
27 }
28
29 func addImageSourceLayer() {
30 let coordinateQuad: NGLCoordinateQuad = NGLCoordinateQuad(
31 topLeft:CLLocationCoordinate2D(latitude: 46.437, longitude: -80.425),
32 bottomLeft:CLLocationCoordinate2D(latitude: 37.936, longitude: -80.425),
33 bottomRight:CLLocationCoordinate2D(latitude: 37.936, longitude: -71.516),
34 topRight: CLLocationCoordinate2D(latitude: 46.437, longitude: -71.516)
35 )
36
37 let imageSource = NGLImageSource(identifier: "style-image-source-id", coordinateQuad: coordinateQuad, image: UIImage(named: "southeast_radar_0")!)
38 if let source = nbMapView.style?.source(withIdentifier: "style-image-source-id") {
39 nbMapView.style?.removeSource(source)
40 }
41 nbMapView.style?.addSource(imageSource)
42 let rasterLayer = NGLRasterStyleLayer(identifier: "style-raster-image-layer-id", source: imageSource)
43 if let layer = nbMapView.style?.layer(withIdentifier: "style-raster-image-layer-id") {
44 nbMapView.style?.removeLayer(layer)
45 }
46
47 nbMapView.style?.addLayer(rasterLayer)
48 Timer.scheduledTimer(timeInterval: 0.8, target: self, selector: #selector(updateAnimatedImageSource(_:)), userInfo: imageSource, repeats: true)
49 }
50
51 @objc func updateAnimatedImageSource(_ timer: Timer) {
52 guard let imageSource = timer.userInfo as? NGLImageSource else { return }
53 let uiImage = UIImage(named: "southeast_radar_\(radarSuffix)")
54 imageSource.setValue(uiImage, forKey: "image")
55 radarSuffix += 1
56 if radarSuffix > 3 {
57 radarSuffix = 0
58 }
59 }
60
61}
62extension AnimateMapLayerViewController: NGLMapViewDelegate {
63 func mapView(_ mapView: NGLMapView, didFinishLoading style: NGLStyle){
64
65 nbMapView.setCenter(CLLocationCoordinate2DMake(41.437, -76.425), zoomLevel: 5, animated: true)
66 addImageSourceLayer()
67 }
68}
The main functionality of this example is to display a map view with an animated image overlay (radar images). The addImageSourceLayer() method sets up the image source and raster layer, and the updateAnimatedImageSource(_:) method is called periodically to update the image source with new radar images.
-
Declaration and initialization of nbMapView, radarSuffix, and points variables.
-
viewDidLoad() method where the nbMapView is created and added as a subview to the view.
-
addImageSourceLayer() method to add an image source and raster layer to the map view.
-
updateAnimatedImageSource(_:) method to update the image source with a new image.
-
mapView(_:didFinishLoading:) delegate method that sets the initial center and zoom level of the map and calls addImageSourceLayer().