iOS: selected ViewAnnotation doesn't render on top

[mfazekas]

Environment

• Xcode version: 13.4.1
• iOS version:15.5
• Devices affected: Simulator
• Maps SDK Version: 10.8.1

Observed behavior and steps to reproduce

Executing

try! viewAnnotations.update(viewGreen, options: ViewAnnotationOptions(selected: true))

should bring the green view forward, according to the documentation:

selected meaning it should be placed on top of others.
https://docs.mapbox.com/ios/maps/api/10.8.1/Structs/ViewAnnotationOptions.html#/s:10MapboxMaps21ViewAnnotationOptionsV8selectedSbSgvp

However green annotation was not placed on top

class ViewController: UIViewController {
  
  internal var mapView: MapView!

  func buildView(_ color: UIColor = UIColor.red) -> UIView {
    let view = UIView(frame: CGRect(x:0,y:0,width:40,height:40))
    view.backgroundColor = color
    return view;
  }

  override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view.
    
    let myResourceOptions = ResourceOptions(accessToken:accessTokenSch)
    let myMapInitOptions = MapInitOptions(resourceOptions: myResourceOptions, styleURI: StyleURI.streets)
    mapView = MapView(frame: view.bounds, mapInitOptions: myMapInitOptions)
    mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]

    let mapCenter = CLLocationCoordinate2D(latitude: 33.448376, longitude: -112.074036)
    let coordRed = mapCenter
    let coordGreen = CLLocationCoordinate2D(latitude: coordRed.latitude+0.01, longitude: coordRed.longitude-0.01)
    let coordBlue = CLLocationCoordinate2D(latitude: coordRed.latitude+0.02, longitude: coordRed.longitude-0.02)
    let viewRed = self.buildView(UIColor.red)
    let viewGreen = self.buildView(UIColor.green)
    let viewBlue = self.buildView(UIColor.blue)
    
    let viewAnnotations = self.mapView.viewAnnotations!

    
    mapView.mapboxMap.onNext(.styleLoaded) { _ in
      var source = RasterDemSource()
      let sourceId = "raster-dem-source"
      source.tileSize = 512
      source.url = "mapbox://mapbox.mapbox-terrain-dem-v1"
      source.minzoom = 0.0
      source.maxzoom = 29.0
      try! self.mapView.mapboxMap.style.addSource(source, id: sourceId)
      var terrain = Terrain(sourceId: sourceId)
      terrain.exaggeration = Value.constant(20.0)
      try! self.mapView.mapboxMap.style.setTerrain(terrain)
      
          mapView.mapboxMap.onNext(event: .styleLoaded) { _ in
      self.mapView.camera.fly(to: CameraOptions(center:
          mapCenter,
        zoom: 10.0
       ))
      
      try! viewAnnotations.add(viewRed, options: ViewAnnotationOptions(geometry: Geometry.point(Point(
        coordRed
      )), allowOverlap: true, selected: false))
      try! viewAnnotations.add(viewGreen, options: ViewAnnotationOptions(geometry: Geometry.point(Point(
        coordGreen
      )),allowOverlap: true, selected: false))
      try! viewAnnotations.add(viewBlue, options: ViewAnnotationOptions(geometry: Geometry.point(Point(
        coordBlue
      )),allowOverlap: true, selected: false))
    }
    
    DispatchQueue.main.asyncAfter(deadline: .now() + 5.0) {
        print("selecting green view")
        try! viewAnnotations.update(viewGreen, options: ViewAnnotationOptions(selected: true))
        print("selected green view: \([viewAnnotations.options(for: viewRed)?.selected, viewAnnotations.options(for: viewGreen)?.selected, viewAnnotations.options(for: viewBlue)?.selected])")      
    }
    
    self.view.addSubview(mapView)
  }


}

Expected behavior

Selected view annotation should be placed on top.

Notes / preliminary analysis

As a workaround one could remove/readd that annotation. Currently it seems that annotation rendering order depends solely on the order they've been added.

Additional links and references

N/A

[ZiZasaurus]

@mfazekas thank you for reporting this behavior. I am working on a fix and will let you know as soon as it merged.

[ZiZasaurus]

@mfazekas, this fix is available in our 10.9-rc.1 release.