swift - 네이버맵 연동하기 (지도 띄우기)

개인적으로 네이버맵은 카읍읍맵보다 사용하기 쉽고, 많은 것을 제공한다고 느꼈습니다.

 

그래서 이번 시간에는 네이버맵 사용법을 알려드리려고 합니다!

 

빠-밤

 

아주 쉬우니 따라오시기 편할겁니다 ㅎㅎ

 

---

클라이언트 ID 발급받기

사용할 Key를 발급받기 위해 네이버 클라우드 플랫폼 콘솔에 들어갑니다.

https://console.ncloud.com/dashboard

 

 

그럼 이런 화면이 나옱텐데~ 

 

좌측 메뉴에서 Services - AI NAVER API 순으로 클릭해줍니다!

 

그럼 이런 화면이 나올텐데!

여기서 Application 등록 버튼을 눌러봅시다

 

우선 Application 이름을 적고,

 

Service 선택 섹션에서 아래로 살짝 내리면 Maps가 보일텐데,

여기서 우리는 모바일에 사용할 것이기 때문에 Mobile Dynamic Map을 클릭합니다.

 

그 다음 아래로 더 내려가 보면 이런 화면이 나옵니다!

여기서 프로젝트의 Bundle ID를 적은 뒤 옆에  +추가 버튼을 눌러줍니다.

그러면 등록 버튼이 활성화 되는데, 클릭을 해서 저장을 합니다.

 

쟈라쟌~

그럼 이렇게 키 발급이 완료됩니다!

 

 

---

프로젝트 세팅

이제 SDK를 받아와야 합니다.

pod 파일에 들어가서

target 'YourApp' do

    pod 'NMapsMap' // 이 부분을 추가

end

이렇게 추가하고 pod install을 해줍시다.

 

아까 발급받은 클라이언트 ID 등록을 할 차례인데요!

방법은 두 가지가 있습니다. (아래 방법 중 편한 방법 한 개만 선택하세요!)

 

1. Info.plist에 추가

<?xml version="1.0" encoding="UTF-8"?>
http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
...
    <key>NMFClientId</key>				// 추가
    <string>YOUR_CLIENT_ID_HERE</string>		// 추가
...
<dict>
<plist>

Info.plist 파일을 우클릭 하고 Open As - Source Code를 클릭한 뒤, 위처럼 발급받은 클라이언트 ID를 추가하시면 됩니다.

 

2. API 호출

프로젝트의 AppDelegate 파일에 들어가서

NMapsMap를 import 해주고,

 

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        ...
        
        NMFAuthManager.shared().clientId = "YOUR_CLIENT_ID"
        
        ...
    }

이 코드를 추가합니다. 

"YOUR_CLIENT_ID" 부분에는 아까 발급받은 ID 값을 넣으시면 됩니다!

 

 

---

지도 띄우기

 

이제 모든 준비가 끝났습니다!

 

맵을 보여줄 ViewController 파일에 들어가서

override func viewDidLoad() {
    super.viewDidLoad()

    let mapView = NMFMapView(frame: view.frame)
    view.addSubview(mapView)
}

이렇게 추가하고 빌드를 하면...! 

 

WOW

 

지도가 잘 나옵니다!

 

MapView와 관련된 메소드들은 다음 포스팅에서 다루도록 하겠습니다 :)

swift - 네이버맵 연동하기 (메소드)