네이버맵 api v3 알아보기

네이버에서 새로운 지도 api를 공개하였습니다. 바로 NAVER MAP API V3 !! 이전 버전과 비교해 무엇이 달라졌을까요? 그리고 아직 맵 api를 모르시는 분들을 위해서 우선 간략하게 지도 API가 어떤 것인지 알려드리도록 하겠습니다. 그럼 먼저 지도 API에 대하여 알아보도록 하겠습니다.

! 지도 api는 무엇인가

지도 api를 사용할 경우 위치를 기반으로한 다양한 서비스를 구축할 수 있습니다. 간단하게는 특정 위치 정보를 보여줄 수 있고 더 나아가 현재 위치를 기반으로 데이터맵을 그리고 주변위치 정보를 분석해 특정 스타일 또는 도형으로 표시하는 등의 활용방안이 많습니다. 특히 최근의 다양한 O2O 비즈니스 역시 바로 지도api를 이용한 서비스 중 가장 성장한 분야라고 할 수 있습니다.

국내 지도api 제공업체는 구글, 네이버, 다음 지도 서비스 등이 대표적입니다. 그 외에도 다양한 특징을 가진 지도 api 회사가 존재하고있습니다. 대부분 일정 트래픽을 기준으로 무료와 유료의 기준이 나누어지며  간단한 위치를 보여주면서 사용 트래픽이 많지 않은 경우 무료 서비스로도 이용이 가능합니다. 웹서비스 형태가 아닌 단순 지도 정보를 보여주는 경우라면 무료 서비스만으로도 충분할 수 있습니다.

! 네이버 지도 API v3 특징은?

그렇다면 기존과 다른 이번 버전의 특징은?? NAVER 지도 API v3는 자바스크립트를 사용한 API로 지도 기능에 필요한 여러가지의 자바스크립트 클래스와 메서드를 제공합니다. 지도 api의 경우 리소스 비중이 작지 않아 성능에 대한 이슈가 관건인데 데스크탑과 모바일 환경 그리고 다양한 브라우저에 최적화된 코드를 제공한다 합니다. 아래는 NAVER 지도 API v3가 가진 이번 버전의 대표적 특징입니다.


Standalone API
모바일 최적화
KVO(Key-Value Observing) 디자인
단일 버전 관리

# Standalone API

기존 버전과 큰 차이점은 이번 버전은 JindoJS 프레임워크를 사용하지 않는다는 점입니다. 이를 위해 자체 호환 코드를 내장하고 있으며 더 나은 성능을 보여줄 주 있다는 장점을 가지며 이는 다른 프레임워크, 라이브러리와 함께 사용하는 것이 더 용이하다는 뜻이기도 합니다.

또 다른 특징으로 이전 버전은 별도의 CSS(Cascading Style Sheets)를 필요로 하였으나 이번 버전은 그렇지 않도록 설계되었습니다.

# 모바일 최적화

모바일에서의 지도 API의 사용이 점점 증가하였기 때문에 이번 버전은 대부분의 웹 브라우징 환경과 디바이스에서도 최적의 성능으로 동작할 수 있도록 설계되었습니다. 그리고 단순 터치 이벤트 뿐 아니라 그 외의다양한 모바일 이벤트 함수도 추가되었습니다. 앞으로도 계속 추가될 것이라 합니다.

touchstart
touchmove
touchend

위의 터치 이벤트 외에도 아래처럼 다양한 제스쳐 이벤트가 추가되었습니다.


tap
 - 한 손가락으로 터치
doubletap
 - 한 손가락으로 빠르게 두번 터치
longtap
 - 한 손가락으로 터치를 1초 이상 유지
twofingertap
 - 두 손가락으로 터치
pinch in/out
 - 두 손가락으로 터치 후 손가락을 오므리거나 폄


또한 최신의 CSS3 Transform 속성을 적극적으로 활용하고 있지만 이를 지원하지 않는 경우 자동으로 CSS2 렌더링 방식으로 전환되어 사용되어 더 높은 성능과 최적화로 사용이 가능합니다.

# KVO 디자인

KVO 디자인을 핵심으로 디자인되었으며 이는 Key-Value Observing디자인입니다. KVO 클래스를 상속받은 클래스는 사용자가 관심있는 속성을 바인딩(bind)하여 속성이 변경시 더욱  효율적인 대응을 할 수 있습니다.

# 단일 버전 관리

이번의 NAVER 지도 API v3는 통합된 단일 버전으로 제공되며 버전 정보를 확인은 자바스크립트 파일 상단에 주석에서 확인 가능합니다.