Search code examples
iosswiftmkmapview

How to get lat/lng coordinates from VisibleRegion using Apple MapKit?


I need upperRight and bottomLeft coordinates of the visible mapView.

In mapViewDidChangeVisibleRegion I get the values.

class ViewController: UIViewController, MKMapViewDelegate {

    @IBOutlet weak var mapView: MKMapView!

    var currentLocation: CLLocation!

    override func viewDidLoad() {
        super.viewDidLoad()

        self.mapView.delegate = self

        self.customizeMapView()

        currentLocation =  CLLocation(latitude: ( 37.334922), longitude: (-122.009033))

        self.centerMapOnLocation()

   }

    func customizeMapView(){
        self.mapView.showsBuildings = true
        self.mapView.showsCompass = true
        self.mapView.showsPointsOfInterest = true
        self.mapView.showsUserLocation = false
        self.mapView.userTrackingMode = .none
        self.mapView.showsZoomControls = true
        self.mapView.mapType = .satelliteFlyover       
    }

    func centerMapOnLocation(){

        let centerRegionCoordinate: CLLocationCoordinate2D = CLLocationCoordinate2D(latitude: currentLocation.coordinate.latitude, longitude: currentLocation.coordinate.longitude)

        let spanRegion:MKCoordinateSpan = MKCoordinateSpan(latitudeDelta: 0.0025, longitudeDelta: 0.0025)
        let mapRegion: MKCoordinateRegion = MKCoordinateRegion(center: centerRegionCoordinate, span: spanRegion)
        mapView.setRegion(mapRegion, animated: true)


    }

    func mapViewDidChangeVisibleRegion(_ mapView: MKMapView) {
        print("mapViewDidChangeVisibleRegion")
       /*
         0,0         +x




         +y

        */
        let upperRight = mapView.convert(CGPoint(x: self.view.frame.size.width, y: 0.0), toCoordinateFrom: self.view)
        let bottomLeft = mapView.convert(CGPoint(x: 0.0, y: self.view.frame.size.height), toCoordinateFrom: self.view)

        print("upperRight: \(upperRight) ")
        print("bottomLeft: \(bottomLeft) ")


    }

I expect the coordinated to be correct but I'm getting -180.0.

These are the values I get when initially running the App:

upperRight: CLLocationCoordinate2D(latitude: -180.0, longitude: -180.0) 
bottomLeft: CLLocationCoordinate2D(latitude: -180.0, longitude: -180.0) 

Moving the map horizontally with a gesture:

upperRight: CLLocationCoordinate2D(latitude: -180.0, longitude: -180.0) 
bottomLeft: CLLocationCoordinate2D(latitude: 37.33245941071868, longitude: -122.01073312548439) 

Moving the map vertically with a gesture:

upperRight: CLLocationCoordinate2D(latitude: 37.33687329393082, longitude: -122.00780068382419) 
bottomLeft: CLLocationCoordinate2D(latitude: -180.0, longitude: -180.0) 

Moving the map diagonally with gesture:

upperRight: CLLocationCoordinate2D(latitude: 37.336306795130724, longitude: -122.00839348216184) 
bottomLeft: CLLocationCoordinate2D(latitude: 37.33126864523067, longitude: -122.01130820828396) 

How to perform mapView.convert correctly?


Solution

  • Instead of calculating mapView frame to determine coordinates, I would prefer to use MKCoordinateRegion to get the bounding-box coordinates, like so:

    extension MKCoordinateRegion {
        
        var boundingBoxCoordinates: [CLLocationCoordinate2D] {
            let halfLatDelta = self.span.latitudeDelta / 2
            let halfLngDelta = self.span.longitudeDelta / 2
    
            let topLeft = CLLocationCoordinate2D(
                latitude: self.center.latitude + halfLatDelta,
                longitude: self.center.longitude - halfLngDelta
            )
            let bottomRight = CLLocationCoordinate2D(
                latitude: self.center.latitude - halfLatDelta,
                longitude: self.center.longitude + halfLngDelta
            )
            let bottomLeft = CLLocationCoordinate2D(
                latitude: self.center.latitude - halfLatDelta,
                longitude: self.center.longitude - halfLngDelta
            )
            let topRight = CLLocationCoordinate2D(
                latitude: self.center.latitude + halfLatDelta,
                longitude: self.center.longitude + halfLngDelta
            )
    
            return [topLeft, topRight, bottomRight, bottomLeft]
        }
        
    }
    

    Usage: Showing annotations on MKMapView at top-left, top-right, bottom-right, bottom-left

    class ViewController: UIViewController, MKMapViewDelegate {
    
        @IBOutlet var mapView: MKMapView!
        
        private let annotations: [MKPointAnnotation] = [MKPointAnnotation(), MKPointAnnotation(), MKPointAnnotation(), MKPointAnnotation()]
    
        override func viewDidLoad() {
            super.viewDidLoad()
            
            self.mapView.addAnnotations(annotations)
    
            let currentLocationCoordinate = CLLocationCoordinate2D(latitude: 37.334922, longitude: -122.009033)
            let spanRegion = MKCoordinateSpan(latitudeDelta: 0.0025, longitudeDelta: 0.0025)
            let mapRegion = MKCoordinateRegion(center: currentLocationCoordinate, span: spanRegion)
            mapView.setRegion(mapRegion, animated: true)
        }
    
        func mapView(_ mapView: MKMapView, regionDidChangeAnimated animated: Bool) {
            let bounds = mapView.region.boundingBoxCoordinates
            print("TopLeft: \(bounds[0])\nTopRight: \(bounds[1])\nBottomRight: \(bounds[2])\nBottomLeft: \(bounds[3])")
            for (i, coordinate) in bounds.enumerated() {
                self.annotations[i].coordinate = coordinate
            }
        }
    
    }
    

    That yields

    enter image description here