많이 기다리셨습니다. 오늘은 지도 API 기능 개선 3탄으로 '장소 검색 API'를 공개합니다. 그동안 가장 많은 분들이 다음 지도에서 제공하는 다양한 장소(POI)를 찾고 이를 지도에 표시할 수 있는 기능을 요청해주셨습니다.

이번 개선 프로젝트에는 장소 검색 오픈 API 제공 결정과 아울러 좀 더 편리하게 사용하실 수 있는 방법을 고민하여 아래와 같이 제공해 드립니다.

1. 장소검색 키워드형
장소 검색 키워드형은 특정 질의어에 대해 중심좌표를 정하고, 반경 거리 안에 정확도 및 인기순에 따라 정렬된 장소 검색 결과를 위경도를 비롯 도로명 및 지번 주소, 홈페이지 및 대표이미지, 중심 좌표로 부터 거리와 방향 등 다양한 정보를 제공하게 됩니다.




쿼리당 총 제공 건수는 45건으로 한정해서 제공해 드리며, 로컬 API 사용 트래픽 이내에서 사용 가능합니다.
참조: http://dna.daum.net/apis/local/ref#placesearchkeyword

2. 장소 검색 카테고리형
장소 검색 카테고리형은 단순히 주변에 있는 주요 시설을 분류별로 보이고 싶을 때, 사용할 수 잇는 기능으로 편의점, 마트, 주차장, 지하철역, 주유소, 공공기관 등 필요한 코드만 입력해서 장소를 얻어올 수 있는 기능입니다.



예를 들어, 가게 위치나 부동산 물건 표시하는 약도를 제공하는 경우, 그 주변의 교통 및 생활 환경을 한눈에 볼 수 있습니다. 풍부한 장소 검색 결과를 통해 여러분의 서비스와 비지니스에 큰 도움을 드릴 것으로 생각합니다.

쿼리당 총 제공 건수는 45건으로 한정해서 제공해 드리며, 로컬 API 사용 트래픽 이내에서 사용 가능합니다.
참고: http://dna.daum.net/apis/local/ref#placesearchcategory

3. JS 기반 장소 검색 라이브러리
장소 검색 API는 로컬 API로서 제공이 되나, 손쉽게 지도에 넣기 위해서는 요청 및 데이터 처리 등 약간의 개발 능력이 필요합니다. 좀 더 쉽게 장소 검색을 이용하실 수 있도록, 자바스크립트용 지도 API 기능안에 장소 검색 API 라이브러리를 공개합니다. 앞으로 특화된 기능을 묶어둔 다양한 라이브러리를 선 보일 예정입니다.
참고: http://apis.map.daum.net/web/documentation/#services



라이브러리를 통해 간단한 자바스크립트 코드 만으로 지도에 장소를 바로 표시할 수 있습니다. 여러분이 바로 사용할 수 있도록 6가지의 샘플코드를 준비해 두었습니다.


지도 API 개선 프로젝트는 이게 끝이 아닙니다! 여러분의 성원에 따라 더 많은 것을 나눌 예정입니다.

많은 피드백 부탁드립니다.



신고
Posted by 비회원

댓글을 달아 주세요

  1. 2015.03.18 15:29 Address Modify/Delete Reply

    비밀댓글입니다

안녕하세요. 오늘은 지도 API 기능 개선 2탄으로 '지도 API 전용 사이트'를 공개합니다.



깔끔한 인터페이스와 친절한 설명, 그리고 더 풍부해진 예제로 개발자들이 소스 코드 복사만으로도 기능 구현을 할 수 있는 다음 지도 API 사이트(apis.map.daum.net)를 방문해 보세요.


이 사이트는 지도 API를 사용하는데 있어 불편함이 없도록 쉬운 접근과 다양한 샘플 제공에 방점을 두고 기획 되었고, 실제 개발자의 입장에서 API 사용에 어려움이 없는지 짚어보고, 지도 API가 적용된 웹 페이지와 모바일 앱들을 분석해 활용도 높은 사례를 추려냈습니다.

웹 API와 안드로이드, iOS 버전으로 구분돼 있으며, 각각의 페이지에서는 초보 개발자들도 쉽게 이해할 수 있도록 개발 환경 설정부터 API 키를 이용해 코드를 작성하는 방법까지 상세하게 안내하고 있습니다.



 자주 사용되는 50개 이상의 지도 API 활용 샘플을 제시하여, 단순 지도 정보의 삽입 뿐 아니라, 지도나 로드뷰에 다양한 형태의 콘텐츠 올리기, 지도의 움직임 제어하기, 지도와 로드뷰 연동하기 등 유용한 샘플들이 코드와 함께 보여집니다.


특히, ‘직접 해보기’ 기능을 이용, 테스트 페이지 상에서 각 코드를 필요에 맞게 수정해가면서 실제 구현되는 모습을 미리 확인하는 것도 가능합니다. (안드로이드나 iOS의 경우 직접 기기에 설치해서 확인할 수 있는 샘플 프로젝트를 제공)


지도 API 지원 사이트를 통해 더 많은 활용 사례가 나오기를 기대하며, 다양한 의견 또한 부탁드립니다.

앞으로 나올 기능 개선 3탄도 기대해 주세요!


신고
Posted by 비회원

댓글을 달아 주세요


오늘은 즐거운 지도 API 업데이트 소식을 알려드리겠습니다.


다음 지도앱 및 모바일 앱 지도 라이브러리에 이미 탑재되어 있는 "고화질 HD 지도 타일 서비스"가 지도 API에도 적용되었습니다. HD급 다음 지도 API는 요즘 한창 나오고 있는 고해상도 장비에서 지도API의 기본 타일로 설정되어, 고해상도 단말에서 흐릿하게 보이던 지도 정보를 더 또렷하게 보실 수 있었습니다.


즉, 아이폰4이상, 레티나 아이패드/맥북, 고해상도 안드로이드폰 등 픽셀 비율이 1이 초과되는 기기에 한해 HD 지도 타일이 기본으로 제공됩니다. 기기의 pixel ratio (픽셀비율) 값이 1이 초과되는 경우, (ex. 보통 레티나 디스플레이라고 얘기하는것들이 2이며, 갤럭시S1,2 등은 1.5, 갤럭시S3은 2. 갤럭시S4는 3임)에서는 다음 지도 API만 더 선명한 지도를 보실 수 있게 됩니다.



누구나 활용 가능한 지도 API로서는 국내 최초이며, 모바일 고성능 단말에서 안구정화의 경험을 얻으실 수 있습니다. 아울러 지도 API를 활용하시는 분 중에 일부에서는 스펙이 좋지 못한 고해상도 모바일기기에서는 느려 지거나, 3G 데이터 사용량이 증가하는 문제가 발생할 수 있습니다.


지도 API는 택배 기사, 퀵배달 아저씨, 주부 사원 등 다양한 계층의 사용자 분들이 계시기에 지도 API 개발자들이 "HD 타일 이미지 대신 일반 화질 타일 이미지만 사용"하게끔 daum.maps.disableHD(); 옵션을 추가하였습니다.


위 기능을 실행할 경우 window.devicePixelRatio > 1 인 고행상도 장비에서도 고해상도 타일 이미지를 사용하지 않도록 변경하여 줍니다. (단 반드시 Map 객체 생성 전에 호출해 주어야 합니다.)


앞으로 더 나은 지도 API 기능 추가도 예정하고 있으니, 많은 성원 및 의견도 부탁 드립니다.


저작자 표시 비영리 변경 금지
신고
Posted by 정주Go

댓글을 달아 주세요

  1. 선호 2013.07.30 02:42 신고 Address Modify/Delete Reply

    안구정화의 경험 ㅋㅋ

작년 부터 오픈 API를 이용한 제휴 협력이 본격화 되고 있습니다. 오늘은 그 중에 두 가지 다음 지도 API 제휴 사례를 소개해 드리고자 합니다. 얼마전에 대통령 선거가 있었는데, 지난 4월 총선에 이어 이번 선거에서도 선거관리위원회 투표소 찾기에 지도 API를 제공하였습니다.


뿐만 아니라 SBS 서울방송이 매우 재미있는 선거 방송을 했었지요? 인터랙티브한 영상과 컴퓨터 그래픽 그리고 소셜 네트웍과 연계해서 매우 좋은 반응을 이끌어 내었습니다. 다음에서는 후보들의 위치를 실시간으로 추적하는 화면을 위해 오픈 API를 제공하였으며, 소셜픽 API를 통해 트위터 반응에 대한 정보를 제공하여 유권자들이 보다 즐겁게 선거 방송을 볼 수 있도록 하였습니다.



또한, 지난 10월에 출시한 '아이나비 R11 AIR'는 다음의 고용량 항공지도와 경로 검색부터 안내까지 한 눈에 확인할 수 있으며, 이 네비게이션 기기는 다음의 스카이뷰와 로드뷰를 API를 통해 제공하고 있습니다.


즉, 통신 연결 시 목적지의 실제 사진을 미리 확인할 수 있는 '로드뷰' 기능으로 운전자들이 정확한 정보를 확인할 수 있어 보다 쉬운 길안내가 가능해졌습니다. 이제 PC와 모바일을 넘어서 다양한 기기에도 API를 제휴하여 적용하는 시대가 되었습니다.



다음에서는 검색과 지도, 마이피플과 다음 TV+에 대한 제휴 신청을 받고 있으며, 오픈 API를 활용하는 다양한 제휴를 모집하고 있습니다. 관심있는 분들은 제휴 문의를 통해 제안해 주십시오.

저작자 표시 비영리 변경 금지
신고
Posted by 비회원

댓글을 달아 주세요

iOS 6 업데이트에 대한 대응으로 모바일앱용 지도API가 업데이트 되었습니다. 모바일앱용 지도API 최신 버전은 항상 아래 URL에서 다운로드 받으실 수 있습니다.

http://dna.daum.net/apis/mmaps

이번 업데이트에 대한 자세한 변경사항은 아래와 같습니다.

iOS ChangeLog

1.1.0 (2012/10/10)
  • HD 지도 타일지원(MTMapView.useHDMapTile, Retina Display인 경우 자동으로 HD지도가 설정됨)
  • iOS 6 SDK 지원
    • armv7 armv7s 바이너리 제공
    • armv7s 바이너리가 추가로 제공되고, SDK6부터 armv6가 지원되지 않아 framework binary에서 armv6 제거 (armv6를 지원하고자 하는 앱개발자는 1.0.9 버전을 사용해야 함)
    • XCode 4.5 (iOS 6) 기준 샘플 프로젝트 제공 (iPhone5 해상도 대응 포함)
  • 마커 눌렀을 때 나타나는 말풍선(CALLOUTBALLON)과 기본제공 핀 이미지 디자인 개선 (Daum지도앱 3.0 배포본과 동일 UI)
  • 앱개발자가 사용자 지정 마커이미지(MTMapPOIItem.customImageAnchorPointOffset)를 사용하는 경우 AnchorPoint를 지정(MTMapPOIItem.customeImageAnchorPointOffset) 하는 방법을 잘 몰라서 마커 이미지 위치와 말풍선 꼭지 위치가 어긋나보이도록 앱을 배포하는 경우가 종종 발견되어, AnchorPoint 지정 안 해도 기본으로 마커 이미지의 하단 중앙으로 설정되도록 수정

기존 사용자 필독!

기존에 모바일앱용 지도API(iOS)를 사용하시던 분들은 아래와 같이 대응하실 수 있습니다.
  1. 자신의 XCode Project에서 "DaumMap.embeddedframework"를 delete
  2. 배포되는 1.1.0 framework를 다시 Xcode project에 "Add Files ..."로 import

이렇게 해야 새로 추가된 이미지 리소스가 프로젝트에 반영됩니다. 신규 이미지 리소스들이 반영되지 않으면 디자인 변경된 말풍선 이미지의 꼭지 부분이 안 보이게 됩니다.


저작자 표시
신고
Posted by 타돌이

댓글을 달아 주세요

어제 저녁 Daum 지도의 개편이 있었습니다.

로드뷰 관련 기능 추가

우선 기능적으로는 다음과 같은 2가지가 추가되었습니다.
  1. 로드뷰 라인 미리보기
  2. 지도검색서제스트에서 로드뷰 정보 미리보기

이와 관련해서는 Daum지도 공식 블로그에도 설명되어 있습니다.^^

지도 API v3 기반의 코드로 탈바꿈

특히, 이번 개편에서는 겉으로 보이지는 않지만, 기존 코드를 업데이트 하는 수준이 아닌 소스코드 수준에서 완전히 새로 작성되면서 가볍고, 빨라졌습니다. 그리고 그 코드는 다름이 아닌 지도API v3(beta)와 같은 기반의 코드입니다.

지도API v2

지도API v2 예제 (http://dna.daum.net/examples/maps/maps2/simple.html)


지도 API v3

지도API v3 (http://dna.daum.net/examples/maps/maps3/simple.html)


위와 같이 firebug로 지도 API v2 예제v3 예제를 비교해봤습니다. 아~ 참 아름답지 않나요?^^ 이렇게 가볍기 때문에 모바일웹 지도로도 손색이 없습니다.

이번 개편에 참여하셨던 분들께 "님들 좀 짱!" 이라고 하고 싶네요ㅎㅎ

앞으로 지도 API v3 많은 이용 바랍니다!
저작자 표시
신고
Posted by 타돌이

댓글을 달아 주세요

  1. 2011.03.08 17:49 Address Modify/Delete Reply

    비밀댓글입니다

지도 API를 흔히 많이 사용하는 예가 약도를 만드는 일일 것입니다.

HTML과 Javascript에 익숙하신 분들께는 그리 그리 어렵지 않지만 개발에 대해 잘 모르시는 분들께서는 좀 힘들어 하시는 것을 많이 봤습니다. 그래서 약도 만들기 도구를 만들었습니다.


이번 약도 만들기 도구는 지도API v3가 사용되었고, 저희팀의 귀염둥이 인턴 전근재 님께서 만들어 주셨습니다.^^ (저는 옆에서 열심히 갈굼질을..ㅎㅎ)

삽입할 지도에 대한 정보(위치, 지도크기 등)를 입력하면 최종적으로는 아래와 같이 소스코드가 나옵니다.


그러면 회색박스 안에 있는 소스코드를 여러분들의 사이트에서 넣고 싶은 곳에 삽입하면 지도를 보실 수 있을 것입니다.


많은 이용 바라구요, 문의사항 및 기타 의견 있으시면 언제든지 Q&A게시판에 올려주시기 바랍니다.^^

행복한 추석 연휴 되세요~


덧) 전 26일까지 휴가, 27~29일 예비군 동원훈련을 간답니다. 가끔씩 들어와서 보겠지만 혹시 답변이 늦게 달리더라도 양해 바랍니다^^;

저작자 표시
신고
Posted by 타돌이

댓글을 달아 주세요

  1. Favicon of http://keepburning.tistory.com BlogIcon 황타 2010.09.30 16:51 신고 Address Modify/Delete Reply

    앗.. 지금까지 이런 기능이 없었나요??
    지금까지 없었다는게 신기..^^;
    얼릉 Daum 지도 안에 적용 시켜주세요~
    활용도가 높을 것 같아요.

    • Favicon of http://daumdna.tistory.com BlogIcon 타돌이 2010.09.30 17:34 신고 Address Modify/Delete

      Daum지도 서비스에는 이미지 형태로 퍼가는 것만 있습니다. 그래서 지도 컨트롤이 불가능하죠.

      오픈API 형태로 퍼가는 부분은 해당팀과 논의를 해봐야할 것 같습니다.

  2. 름름 2012.03.30 10:43 신고 Address Modify/Delete Reply

    오!! +_+ 감사합니닷!! 덕분에 약도를 쉽게 넣을수잇네요 ㅎㅎ
    API약도는 왜케 할때마다 헤메는지 ㅠㅠ

    근데 내용란에 텍스트를 넣으면 가운데정렬이 되지않아. 스타일로 먹이려하니 오류가나네영~^^;;

    요것만좀더 보안해주신다면 정말 감사할것같아요 ㅎㅎ

  3. 질문 2012.11.20 22:55 신고 Address Modify/Delete Reply

    혹시 이 약도 생성한 것을 링크로 생성하여 웹에서 볼수있게하는방법은 없을까요

  4. 학생 2012.12.11 16:56 신고 Address Modify/Delete Reply

    약도만들기..저희도 똑같이 한번 따라만들어보고자 하는데요...

    step1에서.. 위치를 지정하고 step2로넘어가잖아여...
    그럼.. step1에서 받은 좌표값을 어떻게 step2 맵을 그리는 부분에 넣을 수 있나요...

    • Favicon of http://daumdna.tistory.com BlogIcon 타돌이 2012.12.13 11:11 신고 Address Modify/Delete

      Server-side 코드를 구현해서 get, post 값을 받아서 처리합니다.
      client-side에서 다 처리하려면 cookie를 이용하거나, HTML5 기능 중 하나인 local storage 를 사용합니다.

  5. 직장인1 2013.01.02 15:36 신고 Address Modify/Delete Reply

    약도만들기에서 검색이 안되네요... 그래서 직접 드래그해서 위치 찾는중....

Daum의 오픈API를 담당하면서 가장 많은 관심과 질문을 받게되는 API는 무엇보다도 지도API입니다. 그리고 질문을 받고 답변하면서, 이런 부분만 지켜줘도 고생을 좀 덜 할 것 같은 부분이 있어서 팁을 정리해 봅니다.

XHTML 사용 권장

XHTML은 HTML4보다 문법적으로 좀 더 엄격합니다. 따라서 웹브라우저 특성도 덜 타고, 웹브라우저 입장에서 해석하기 편하기 때문에 성능도 높습니다. 또한 JavaScript를 통한 제어가 더 깔끔합니다. 그리고 참고로 XHTML에서는 태그를 소문자로 하는게 표준입니다.

table레이아웃은 이제 그만

문의를 주시는 분들 중 table레이아웃을 사용하시는 분들이 굉장히 많습니다. table이라는 태그는 tr, td 등과 함께 쓰이므로 복잡하고 당연히 성능도 떨어지고, 그런 레아아웃 하에서 쓰인 지도API가 제대로 동작하지 않는 경우가 발생하기도 합니다.

<script> 실행부분은 </body> 직전에 배치

HTML 파싱이 다 끝나기 전에 script가 실행되면 HTML Element를 인식하지 못해서 에러가 나기도 합니다. 이 경우 script 태그의 attribute로 defer 속성을 사용하기도 하는데 이는 IE전용입니다. 하지만 HTML4 표준속성이기도 합니다. 하지만 다른 대부분의 브라우저들이 지원하지 않으므로 가급적 </body> 직전에 배치하는 방법을 사용하거나 onLoad 객체를 이용해 보시기 바랍니다.

IE7 호환을 위해 Meta태그 추가

IE7와 IE8 호환을 위해 <head> 태그 사이에 다음과 같은 메타태그를 추가 하시면 도움이 됩니다.

 <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

onclick과 href 구분

onclick에 올 수 있는 값은 Javascript 코드이고, href에는 URL이 올 수 있습니다. 가급적 마크업에 자바스크립트 코드 특히 javascript 같은 슈도 프로토콜을 쓰는 방법은 권장되지 않습니다만 꼭 필요한 경우 가급적 onClick에 쓰는 것을 권장합니다.

예를 들어 "마커추가"를 클릭했을 때 addMarker()라는 Javascript 함수가 수행하게 할 때 올바른 예와 잘못된 예는 다음과 같습니다.

올바른 예)

<a onclick="addMarker()">마커추가</a>

잘못된 예)

<a href="addMarker()">마커추가</a>
<a onclick="javascript:addMarker()">마커추가</a>


쓰고 보니, 지도 API를 팁이라기 보다. Front-End 개발 팁에 가깝네요^^; 이 정도만 잘 지켜주셔도 삽질을 많이 줄일 수 있으리라 생각됩니다.

혹시 다른 팁이 있으신 분들은 댓글이나 트랙백 달아주시면 추가시키겠습니다.

사실 이런거 신경 안 쓰고도 지도API를 쉽게 쓸 수 있게 만들어야 하는데, 만만치가 않네요.^^;


저작자 표시
신고
Posted by 타돌이
TAG Q&A, 지도API,

댓글을 달아 주세요

지도API에서 로드뷰 기능이 추가 되었습니다!

Daum 로드뷰는 국내 최초로 360도 거리사진을 서비스하고 있으며, 많은 분들로 사랑을 받고 있습니다. 또한 API 공개의 요청도 가장 많았던 서비스이기도 하죠.^^

이번 로드뷰 기능은 기존 지도API에서 새로운 클래스(DRoadView, DRoadViewClient, DRoadViewOverlay)가 추가되는 형태로 제공됩니다. 따라서 기존 지도API를 사용하고 계시던 분들께서는 새로 추가된 클래스를 바로 사용하시면 로드뷰를 사용하실 수 있습니다.

다음 페이지들을 참조하세요~^^


로드뷰 오픈 이벤트

이번 로드뷰 오픈과 함께 4월 30일(금)까지 갤러리에 로드뷰 기능을 활용한 좋은 예제를 올려주시는 5분께는 1만으로 제한되어 있는 지도API 트래픽 제한을 10만으로 올려 드리겠습니다.

또한 5월(날짜 미정)에 열리는 10회 Daum DevDay에서는 로드뷰 + OAuth를 주제로 열릴 예정이오니, 로드뷰를 이용한 여러분들의 기발한 아이디어 기대 하겠습니다.

저작자 표시
신고
Posted by 타돌이

댓글을 달아 주세요

  1. 프리윌 2010.04.02 12:26 신고 Address Modify/Delete Reply

    로드뷰와 함께 OAuth로 Write형 API가 많이 오픈 되면 Foursquare 못지 않은 멋진 서비스들이 많이 개발 될 것으로 기대됩니다.

    개발자 여러분들 고고씽~!!

  2. 김동수 2010.04.02 19:10 신고 Address Modify/Delete Reply

    우왕~ 정말 많이 기다렸는데!!!
    드디오 오픈했군요!!^^ 좋은 매쉬업들이 많이 나왔으면 좋겠어요~

  3. Favicon of http://taeks.tistory.com BlogIcon Lucifer 2010.04.04 22:34 신고 Address Modify/Delete Reply

    드디어 오픈^^ 관계자분들 정말 수고많으셨습니다~~^^

티스토리 툴바