MGLUserLocationAnnotationView subclass does not take the pitch perspective of the camera

Question

I have styled the user location icon according to these docs:

https://docs.mapbox.com/ios/maps/examples/user-location-annotation/

It works, but although I worked with camera and pitch, it is displayed in two dimensions. How can i make it that it is in the right perspective of the camera and the pitch effect works?

I added MGLMapCamera with this code:

func mapViewDidFinishLoadingMap(_ mapView: MGLMapView) {
       // Wait for the map to load before initiating the first camera movement.

       mapView.camera = MGLMapCamera(lookingAtCenter: mapView.centerCoordinate, altitude: 200, pitch: 50, heading: 0)
              
}

Isn't there a camera option mode like gps for Android? https://docs.mapbox.com/android/maps/examples/location-component-camera-options/

I couldn't comment (too little reputation) but I figured I would ask you this anyway: what is your icon pitch alignment set to? see also: https://docs.mapbox.com/ios/api/maps/6.0.0/Classes/MGLSymbolStyleLayer.html#/c:objc(cs)MGLSymbolStyleLayer(py)iconPitchAlignment — taetscher, Jul 21 '20 at 11:06
Thanks for your answer. How could I implement this in the example above? There is no MGLSymbolStyleLayer. — desmeit, Jul 21 '20 at 14:17

score 0 · Answer 1 · answered Jul 24 '20 at 11:47

If you want the annotation view to tilt with the map view, you can use the MGLAnnotationView:scalesWithViewingDistance property. This determines whether the annotation view grows and shrinks as the distance between the viewpoint and the annotation view changes on a tilted map.

When the value of this property is YES and the map is tilted, the annotation view appears smaller if it is towards the top of the view (closer to the horizon) and larger if it is towards the bottom of the view (closer to the viewpoint).

Thanks for your answer. I tried that but this is not what I mean .I want the icon/arrow to take the perspective of the camera. Especially pitch. In your example only the size of the icon is changed. — desmeit, Jul 28 '20 at 14:57

score 0 · Accepted Answer · answered Jul 29 '20 at 10:13

I found a solution.

As far as I can see, there is no way to set this with an option. So I solved it manually:

First, I create an image:

private func setupLayers() {

     if arrow == nil {
           arrow = CALayer()
           let myImage = UIImage(named: "arrow")?.cgImage
           arrow.bounds = CGRect(x: 0, y: 0, width: size, height: size)
           
           arrow.contents = myImage
        
           layer.addSublayer(arrow)
     }
}

Then I use MGLRadiansFromDegrees to convert from radians to degrees and transform the image with every update:

override func update() {
       // Convert Optional to Double
       let camerapitch = Double(mapView?.camera.pitch ?? 0)
        
       let pitch: CGFloat = MGLRadiansFromDegrees(camerapitch)
        
       layer.transform = CATransform3DMakeRotation(pitch, 1, 0, 0)
}

MGLUserLocationAnnotationView subclass does not take the pitch perspective of the camera

2 Answers2