MapKit 사용법

iOS에서 지원해 주는 MapKit을 활용하여 특정 좌표에 Pin을 보여주는 예제입니다.

 

import UIKit
import MapKit

class ViewController: UIViewController {

    
    private let mapView = MKMapView()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white
        layout()
    }
    
    
    
    private func layout() {
        view.addSubview(mapView)
        
        // Auto Resizng 해제
        mapView.translatesAutoresizingMaskIntoConstraints = false
        
        NSLayoutConstraint.activate([
            mapView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
            mapView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
            mapView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
            mapView.heightAnchor.constraint(equalToConstant: 500)
        ])
        
    }


}

• MKMapView 사용하기 위해서는 MapKit를 import 해야 합니다.
• 만약 정상적으로 빌드가 되었다면, 아래처럼 지도가 나옵니다.

지도만 연결된 상태	서울 시청을 기준

 

 

특정 좌표를 기준으로 표시

    private func location() {
        
        // 서울 시청 좌표
        let center = CLLocationCoordinate2D(latitude: 37.5665, longitude: 126.9780)
    
        let region =  MKCoordinateRegion(center: center, latitudinalMeters: 300, longitudinalMeters: 300)
        
        mapView.setRegion(region, animated: true)
    }

• CLLocationCoordinate2D(latitude: 위도, longitude: 경도)는 각각 위도와 경도를 설정해 줍니다.
• MKCoordinateRegion(center: center, latitudinalMeters: 300, longitudinalMeters: 300) 설정된 위도와 경도를 기반으로 지도의 축적을 설정합니다.
• latitudinalMeters는 위도 축(세로 방향) 기준
• longitudinalMeters 경도 축(가로 방향) 기준

특정 좌표에 Pin으로 표시

    private func locationWithPin() {
        
        let annotation = MKPointAnnotation()
        
        let center = CLLocationCoordinate2D(latitude: 37.5665, longitude: 126.9780)
        
        annotation.coordinate = center
    
        mapView.region =  MKCoordinateRegion(center: center, latitudinalMeters: 300, longitudinalMeters: 300)
        
        mapView.addAnnotation(annotation)
    }

• annotation.coordinate는 마커의 위치를 선택합니다. (현재 코드에서는 서울시청)
• 이후 mapView의 위치를 설정 후, addAnnotation  메서드를 통해 마커를 추가해 줍니다.
• addAnnotations 메서드를 통해 여러 개의 마커를 추가할 수도 있습니다.

 

간단하게 MKMapView를 활용한 지도에 마커를 추가해 봤습니다.

다음에는 실시간으로 위치를 받아와 지도의 표시하는 예제를 만들어 보도록 하겠습니다