What replaces MGLAnnotationView in Version 10 of Mapbox?

Question

In our application we heavily utilize MGLAnnotationViews because of its flexibility.

We can animate annotations on the map with a MGLAnnotationView.

For instance, a pulsating effect on an annotation is something that is critical to our application.

Previously in Version 6, we accomplished our pulsating effect by:

class CustomAnnotationView: MGLAnnotationView {
    let pointFeature: MGLPointFeature
    let reuseId: String
    let customPulse = CustomPulseLayer() // CAReplicatorLayer

    init(pointFeature: MGLPointFeature, showPulse: Bool) {
        self.pointFeature = pointFeature
        self.reuseId = self.identifier(forFeature: pointFeature)
        super.init(annotation: pointFeature, reuseIdentifier: self.reuseId)
        self.frame = CGRect(x: 0, y: 0, width: 24, height: 24)
        self.layer.cornerRadius = bounds.width / 2
        self.backgroundColor = .systemBlue
        self.addSubview(pointImageView)

        if showPulse {
            layer.addSublayer(customPulse)
            customPulse.start()
        }
    }

    private lazy var pointImageView: UIImageView = {
        let imageView = UIImageView(frame: self.frame)
        let image = self.imageBasedOnIdentifier(self.reuseId)
        imageView.image = image
        return imageView
    }()
}

Would anyone know how to accomplish the same thing in version 10 of Mapbox?

Answer 1

As of Mapbox v10.4.3, the solution that works for me is by using View Annotations. You can add custom gesture recognizers, animations, etc inside your custom annotation view. https://docs.mapbox.com/ios/maps/guides/annotations/view-annotations/#create-a-view-annotation

Sample snippet

let options = ViewAnnotationOptions(geometry: Point(CLLocationCoordinate2D()), allowOverlap: true, anchor: .center)
  let annotationView = CustomAnnotationView()
  annotationView.rx.tapGesture().when(.recognized).subscribe(onNext: { [weak self] _ in
    guard let self = self else { return }
    self.viewModel.input.tappedAnnotation()
  }).disposed(by: self.disposeBag)
  annotationView.didChangeDragState = { [weak self] dragState in
    guard let self = self else { return }
    switch dragState {
    case .dragging:
      self.handleDragging()
    case .ending:
      self.handleEndDragging()
    default:
      break
    }
  }
  try? self.mapView.viewAnnotations.add(annotationView, options: options)

class CustomAnnotationView: UIView {
        // Do your customizations here
    }