Tom Xue Tom Xue - 5 months ago 190
iOS Question

How to change mapkit map view zoom-level with a slider?

So I have a map view(mapkit based) and a slider in my storyboard. As the user slides, map zooms in or out based on their action. How do I implement that? I think that might have something to do with longitudeDelta and latitudeDelta.

Please help me.

import UIKit
import MapKit
import CoreLocation

class ConfigureViewController: UIViewController, MKMapViewDelegate, CLLocationManagerDelegate {

@IBOutlet weak var mapkitView: MKMapView!
@IBOutlet weak var travelRadius: UILabel!
@IBAction func button(sender: AnyObject) {


}

@IBAction func sliderChanged(sender: AnyObject) {
let sliderValue = lrintf(sender.value)
travelRadius.text = "\(sliderValue) mi."
let delta = Double(self.sliderChanged(sender.value))
var currentRegion = self.mapkitView.region

currentRegion.span = MKCoordinateSpan(latitudeDelta: delta, longitudeDelta: delta)
self.mapkitView.region = currentRegion

}




let locationManager = CLLocationManager()


@IBOutlet weak var mapKitView: MKMapView!
override func viewDidLoad() {
super.viewDidLoad()
self.locationManager.delegate = self
self.locationManager.desiredAccuracy = kCLLocationAccuracyBest
self.locationManager.requestWhenInUseAuthorization()
self.locationManager.startUpdatingLocation()

self.mapKitView.showsUserLocation = true




// Do any additional setup after loading the view.
}

override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}

func locationManager(manager: CLLocationManager, didUpdateLocations locations: [CLLocation]) {


let location = locations.last

let center = CLLocationCoordinate2D(latitude: location!.coordinate.latitude, longitude: location!.coordinate.longitude)
let region = MKCoordinateRegion(center: center, span: MKCoordinateSpan(latitudeDelta: 1.5,
longitudeDelta: 1.5))


self.mapKitView.setRegion(region, animated: false)

self.locationManager.stopUpdatingLocation()
}
func locationManager(manager: CLLocationManager, didFailWithError error: NSError)
{
print ("Errors:" + error.localizedDescription)
}






}


Screenshot of my storyboard

Answer

You set the zoom via the region property of the mapView. It defines both the center point of the map and the span (i.e. zoom level)


Edit

Do yourself a favor and define a separate IBOutlet for the slider. It turns out that your slider is measured in miles, but the span is measured in degrees latitude and longitude. How long 1 degree of latitude/longitude is in terms of miles vary depend on your location on Earth. Wikipedia has some discussion on latitude and longitude. Assuming you are on the equator, the conversion is 69 miles per degree of both.

(Remember to connect the outlets)

class ViewController: UIViewController {
    @IBOutlet weak var mapView: MKMapView!
    @IBOutlet weak var slider: UISlider!
    @IBOutlet weak var travelRadius: UILabel!
    @IBOutlet weak var currentLocationLabel: UILabel!

    override func viewDidLoad() {
        super.viewDidLoad()
        sliderChanged(self) // Set the correct zoom according to the slider initial value
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }

    @IBAction func sliderChanged(sender: AnyObject) {
        let miles = Double(self.slider.value)
        let delta = miles / 69.0

        var currentRegion = self.mapView.region
        currentRegion.span = MKCoordinateSpan(latitudeDelta: delta, longitudeDelta: delta)
        self.mapView.region = currentRegion

        travelRadius.text = "\(Int(round(miles))) miles"

        let (lat, long) = (currentRegion.center.latitude, currentRegion.center.longitude)
        currentLocationLabel.text = "Current location: \(lat), \(long))"
    }
}
Comments