그동안 Flutter의 UI 개발하는 방법에 대해서 쭉 포스팅을 진행했었는데요. 어떤 UI를 다룰까 고민을 하다가 지도와 관련된 것들을 다루면 좋겠다고 생각이 들었습니다! 지도를 다루는 부분이 UI라고 해야 할지… 아니면 기능이라고해야할지… 모호하긴 한 것 같습니다.😅 많은 분들이 지도를 이용해서 개발을 하고 싶으실 텐데 Flutter 에서는 어떻게 지도를 이용해서 화면에 보여주는지, 또 여러가지 기능들을 어떻게 써야할지 라고 고민되실 것 같습니다. 저도 처음에 지도를 다룰 때 굉장히 낯설고 어색했거든요…!
저는 최근까지 모빌리티 관련 스타트업에서 재직했습니다. 모빌리티 쪽에서는 지도와 함께 서비스를 제공하는 형태가 많습니다. 모빌리티의 대표격인 카카오T(택시, 주차 등등), 우버와 SKT의 합작사인 UT(우티), 주차할 때 꼭 한번씩 찾아보게되는 모두의주차장, 내 차 없이 공항에 갈 때 필요한 벅시, 주차대행(발렛)이 필요할 때 사용하는 잇차 등등 여러 서비스가 많습니다. (벅시와 잇차는 제가 개발했던 것들이기 때문에 한 번 언급해봤습니다🤣)
이런 모빌리티 서비스를 보시면 모두 지도가 들어가는 것을 볼 수 있습니다. 그런데 또 각각 서비스 마다 다른 지도를 사용합니다.
위의 4가지 지도 서비스 중 구글지도가 전 세계적으로 많이 이용되긴합니다만, 2018년 경 구글지도 서비스가 사실상의 요금 인상으로 인해 네이버지도, 카카오지도의 사용량이 확 늘었습니다. (관련기사 링크)
티맵의 경우는 길안내 관련 Open API들을 많이 사용합니다. 그 외에 티맵지도를 사용하는 경우는 크게 보지 못한 것 같습니다. 실제로 제가 연동해서 써보려고 했는데 다른 지도 서비스에 비해서 뭔가 부족한 부분이 보여서… 음.. 😱
Flutter 라이브러리를 pub.dev 사이트에서 검색해보니 구글지도와 네이버지도, 카카오지도의 라이브러리들을 확안했습니다. 관련해서
구글지도
구글지도는 대부분 위 링크의 라이브러리를 많이 사용합니다. 구글에서 직접 제공하는 라이브러리기 때문에 지속적인 업데이트도 있고, 글을 작성하는 현 시점 기준으로 Like가 2,385 개 입니다.
Readme에 나와있는대로 Android, iOS에 각각 설정해 주기만 하면 지도 서비스를 불러올 수 있습니다. 물론, google api key 는 직접 생성해서 만들어 주어야 합니다. 관련되어 서는 구글지도에 대해서 따로 포스팅 하도록 하겠습니다.
네이버지도
국내 모빌리티 서비스를 제공하는 곳에서 많이 사용하는 것으로 보입니다. 위 예시로 적었던 모두의주차장 외에도 많은 스타트업들이 네이버 지도를 사용하는 것으로 보여집니다. 왜 많이 사용할까 생각했었는데 직접 사용을 해보니 이유가 있는것 같았습니다. 네이버 지도는 구글지도와 거의 유사한 메서드를 제공합니다. 아마도 구글을 사용해서 개발하던 개발자들이 구글 대신 빠르게 네이버로 전환 할 수 있도록 하기 위한 것이라고 생각이 됩니다.
네이버지도의 경우 공식적으로 Flutter 라이브러리를 제공하지는 않습니다. pub.dev 에 검색해보시면 2개정도가 나오는데 전부 개인이 만든 라이브러리로 보입니다. 위 링크의 라이브러리를 눌러보시면 현시점 기준으로 LIKE가 10개 정도밖에 되지는 않습니다. 하지만 최근에 배포되었고 지속적으로 업데이트 할 것 같아 해당 라이브러리를 이용해서 추 후 포스팅 해보도록 하겠습니다.
카카오지도
네이버지도와 마찬가지로 카카오지도도 국내 기업들에서 조금씩 사용량이 들어가고 있는 것 같습니다. 직방 서비스가 카카오지도를 사용하는 것을 확인했습니다.
카카오지도의 경우 pub.dev 에서 검색해보면 몇가지가 나옵니다. flutter_kakao_map 라이브러리의 경우 12개의 LIKE, kakao_map_flutter의 경우 2개가 있습니다.
이 라이브러리는 17개의 LIKE인데 다른 라이브러리들과는 다르게 웹뷰를 통해 구현한 것을 볼 수 있습니다. Flutter 커뮤니티들에서 가끔 카카오지도 관련된 이야기가 나오는데 지금으로써는 웹뷰로 구동하는 카카오지도를 사용하는게 그나마 제일 낫다라는 이야기를 하시는 것 같습니다. 저도 이 패키지를 이용해서 한 번 앱을 구현 해 보고 포스팅 해보도록 하겠습니다.
티맵지도
사실 티맵지도의 경우… 사용하는 곳은 UT말고는 보지 못했습니다. 이전에 제가 써보려고 네이티브 앱에서 티맵지도를 연동해 봤었는데 내부적으로 웹뷰로 구성이 되어 있는 듯 한 끊김(?) 또는 벅벅임(?) 현상이 조금 있었습니다. 지금은 좀 개선이 되지 않았을까? 라고 생각은 됩니다.
그리고 현재 Flutter 에서는 티맵지도 관련된 라이브러리는 존재하지 않습니다. 제가 기회가 되면 Android, iOS 네이티브 SDK를 이용해서 라이브러리를 한 번 만들어 볼까도 생각 중입니다. 만약 만들게 되면 관련해서 포스팅 해보도록 하겠습니다!
저는 Andorid 네이티브 개발을 할때는 위의 지도들을 다 사용해 보긴 했습니다. 2015년경 개발할 당시에는 국내 지도들은 구글지도 외에는 퀄리티가 좋지 않아 구글지도만 사용하다가 네이버지도의 대대적인 업데이트 이후 네이버지도의 퀄리티가 많이 좋아졌습니다. 또 네이버가 제공하는 메서드가 대부분 구글지도의 메서드와 비슷하다 보니깐 이전 하는데도 편리했던 것 같습니다.
저보고 국내에서 서비스 할 앱을 만드는데 어떤 지도를 쓸꺼야? 라고 물어본다면 저는 네이버지도로 만들고 싶다는 생각을 합니다. 해외 서비스는 무조건 구글로 갈 수 밖에 없을 듯 하구요. 그렇지만 위의 지도서비스들을 이용해서 샘플앱도 만들어 보고 제가 알고 있는 것들에 대해 공유를 좀 해보려고 합니다. 지도서비스에서 제공하는 그리기 API들을 통해서 지도에 어떻게 원하는 기능을 추가할 수 있는지에 대해서 공유해 보도록 하겠습니다.
오늘은 어떤 지도서비스가 있고 많이 사용하는 지도서비스는 어떤 건지에 대해 간단히 적어보았습니다. 개발하면서 캡쳐하지 않아서 굉장히 편한 포스팅이었습니다. 😁 그럼 다음 부터는 지도와 관련되어서 조금 더 상세한 이야기와 샘플앱을 만들어 보도록 하겠습니다! 감사합니다! 🙏🏻🙏🏻🙏🏻
