얼마전 다음에서도 지도 Open API를 오픈했습니다.
상관있을지는 모르겠지만, 다음이 지도서비스를 점점 확대해 나가고 있는 추세여서 API의 확장이 주목됩니다.

지도 API의 오픈 기념으로 다음에서 Wii를 경품으로 걸고 공모전을 열었습니다.
저도 한번 시도해 볼까 하고 준비를 했는데, 아무래도 시간내 뭔가 개발하기엔 무리일것 같네요.

뭔가 장난감을 만들려고 다음 지도 API 레퍼런스를 찬찬히 살펴봤는데, 이거 원하는 위치를 검색하여 좌표값을 얻어내는 부분이 아무리 찾아봐도 없는거 아니겠습니까. (혹시 있나요? ㅠㅠ)

어떻게 해야 할까 고민하다가 네이버(Naver) 지도의 geocode.php 를 사용해서 좌표값을 얻어와 사용하기로 했습니다.

2008-11-20 야후 POI로 수정하였습니다. (링크)

우선 네이버 지도에서 좌표값을 얻어 오는 것은 그리 어려운 일이 아닙니다.


으로 쿼리를 날리면 XML로 해당 지역에 대한 정보를 리턴해줍니다.
http://maps.naver.com/api/geocode.php?key=121e2df395922dbf590500128ee788fe&query=%C0%E1%BD%C7
위 링크대로 잠실로 검색하여 주소창에 입력하면 아래와 같은 결과값을 보여줍니다.


이제 이 XML을 갖고 요리를 하면 되는겁니다.

이렇게 얻어낸 좌표값은 ktm 좌표체계를 사용합니다. 반면 다음의 기본 좌표체계는 wgs84를 사용합니다. 따라서 이에 컨버팅을 해 줘야 하는데, 다음지도에서는 ktm 좌표체계도 지원하기 때문에 기본 좌표체계를 ktm으로 변경해주면 해결됩니다.

  var map = new DMap("map"); 
  map.setCoordinateType("ktm");

위 코드와 같이 맵을 생성하고, 맵의 기본 좌표체계를 ktm으로 변경해주시면 별다른 컨버팅 없이 바로 네이버의 geocode를 사용할 수 있습니다.

이 페이지에서 직접 테스트가 가능합니다.
혹 아래 화면에 지도가 보이지 않는 분들은 아래 링크에서 테스트해보시면 됩니다. (원하신다면 ^^)
http://ottd.iruis.net/~onionmen/daum/

그래도 안보이시는 분들은 문자 인코딩을 아래 이미지와 같이 UTF-8로 변경해 주세요.




신고
Posted by onionmen

댓글을 달아 주세요

  1. 2008.11.23 21:11  댓글주소  수정/삭제  댓글쓰기

    비밀댓글입니다

IE8 beta2 세미나가 지난 9월 건국대 새천년 기념관에서 열렸었습니다.

세미나 이전에 IE8용 웹슬라이스 관련 게시물을 작성한적이 있었습니다. 세미나 후에 제 블로그에 IE8과 웹슬라이스로 검색하여 들어오시는 분이 꽤 되었던걸 보면 이슈가 되긴 했었나 봅니다.

[관련글]
2008/08/12 - [Etc..] - [ IE8 ] 웹슬라이스를 적용한 미투데이 최근 댓글 구독.
2008/08/11 - [Etc..] - [ IE8 ] 웹슬라이스(webslices) 적용했습니다.

세미나에선 총 3가지의 기능을 소개했었는데, 그 중 하나가 이전에 소개드린 웹슬라이스고, 나머지 둘이 엑셀러레이터와 비쥬얼서치 입니다.

음, IE8이 선행되어야 한다는 단점 때문에 아직까지는 많은 분들이 이용하지 않고, 그만큼 관심도 상대적으로 적지만 사용자층이 두터워 진다면 재미있는 것들이 많이 나올 것으로 예상됩니다.

웹슬라이스에 이어서 나머지 두개 기능도 한번 만들어봐야지 생각했었는데, 이제야 시도를 해 보았습니다.
막상 해보고 나니 큰 어려움 없이 적용할 수 있었습니다. 아니 큰 어려움도 아닙니다. 정말 쉽더군요. 

딱이죠?

비쥬얼 서치에 적용하면 검색어 추천에, 사진자료까지 딱인듯한 아이템이라 바로 적용해보았습니다.  
위 검색창에 검색어를 입력하러 가지 않아도, 쉽게 검색을 할 수 있도록 만들어보겠습니다.

여기 검색어를 입력해보세요.


바로 익스플로러의 검색어 창에 검색 공급자를 등록하는 것인데요, 이게 생각보다 그리 어렵지 않습니다.


우선 XML 을 만들어야 하는데, 틀은 다음과 같습니다.

 

<?xml version="1.0" encoding="euc-kr"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/"> 
    <ShortName>DNF item</ShortName> 
    <Description>DNF item search</Description> 
        <Url type="text/html" template="http://www.d-fighter.com/?GO=dictionary|item&amp;clickSV=dnf&amp;search_text={searchTerms}" /> 
        <Url type="application/x-suggestions+xml" template="http://ottd.iruis.net/~onionmen/dic_test.xml" /> 
    <Language>ko-kr</Language> 
    <OutputEncoding>euc-kr</OutputEncoding> 
    <InputEncoding>euc-kr</InputEncoding>
</OpenSearchDescription> 

 여기서 중요한 부분은 붉은색으로 표시되어 있는 Url 입니다.

Type

   

Text/html

Request

검색어를 입력했을 때 실제 처리하는 부분

Application/x-suggestions+xml (+json)

optional

검색어 제안등의 부가기능을 제공

첫번째 type이 text/html 으로 되어 있는 부분은 검색어를 넘겼을 때 실제 검색을 처리하는 부분입니다.
바로 검색창에 검색어를 입력하고, 돋보기 아이콘을 클릭했을 때 실제 검색어를 처리하는 부분이죠.

중요한것은 get 방식으로 넘길 때 인자를 구분하는 &의 값을 &amp; 로 써주셔야 합니다.
그 아래 type이 application 으로 되어 있는 부분은 option 입니다. (제가 지금 IE7 이라서 이미지는 주말이 지나서 추가해야 할 듯 싶습니다.)

이미지와 함께 제공되는 검색어 추천을 사용하고 싶다면 저 부분을 따로 개발하여 넣으면 됩니다. +xml 이라고 되어 있으면 xml 타입으로 개발을 해야 하고, +json 으로 표기를 하면 json 으로 출력되도록 개발하시면 됩니다. 나머지 부분은 굳이 신경쓰지 않으셔도 되고, 한번 보시면 다 아실 내용이라 생각됩니다.

이 XML을 서버에 올려놓고 이제 XML을 추가할 수 있도록 "무엇인가" 를 만들어야 겠지요.

뭐 이 "무엇인가" 를 만드는 것은 일도 아닙니다.

<a href="#" onclick="window.external.AddSearchProvider('http://ottd.iruis.net/~onionmen/dnf_item_search.xml')">Add Search Provider Example</a>

위와 같이 window.external.AddSearchProvider() 라는 프로퍼티에 xml위치에 해당하는 인자값 하나만 넣어주면 완성이고, 이 링크를 클릭하면 검색공급자 등록을 할 수 있습니다.

위와 같은 메시지가 뜨면, 공급자 추가를 선택하여 검색공급자를 등록할 수 있습니다.

이제 검색공급자가 추가된 것을 확인하실 수 있습니다.


공급자를 DNF item 으로 변경하고, 검색어를 입력하면 이제 검색된 내용을 볼 수 있게 됩니다.

어때요, 참 쉽죠?

이건 단순한 검색공급자 를 만드는 것이었고, 이제 핵심기능인 비쥬얼서치를 살펴볼까요?

이것또한 별것 없습니다.

<Url type="application/x-suggestions+xml" template="http://ottd.iruis.net/~onionmen/dic_test.xml" /> 

이 부분 기억 하시나요. 여기 들어있는 dic_test.xml 이라는 부분이 바로 비쥬얼서치에 사용될 부분입니다. 지금은 예제로 간단한 xml을 만들었는데, 이부분은 프로그래밍이 들어가야 하는 부분입니다. 검색어에 의해서 관련된 xml이 생성되도록 해야 하지요.

아래 xml은 역전 이라는 검색어를 입력하면 그와 관련된 추천검색어와 비쥬얼서치의 모습을 보여주는 xml 입니다.

<?xml version="1.0" encoding="euc-kr"?>
<SearchSuggestion version="2.0" xmlns="http://opensearch.org/searchsuggest2">
  <Query>역전</Query>
  <Section>
    <Item>
      <Text>역전</Text>
      <Url>http://www.d-fighter.com/?GO=dictionary|item&amp;clickSV=dnf&amp;search_text=역전</Url>
    </Item>
    <Separator title="Finding in DNF" />
    <Item>
      <Text>역전의 월록</Text>
      <Description>거너용 무기</Description>
      <Url>http://www.d-fighter.com/?GO=dictionary|item&amp;TO=&amp;clickSV=dnf&amp;mode=view&amp;search_text=역전&amp;se=&amp;category=&amp;position=1&amp;it_no=31107</Url>
      <Image source="http://img.d-fighter.com/img/item_img/revolver/00037.png" width="28" height="28" />
    </Item>
  </Section>
</SearchSuggestion>


위와 같이 xml을 작성하여 서버에 업로드 하면, 이제 단순한 검색창에서 벗어나 한눈에 검색결과를 볼 수 있게 됩니다.



어때요. 참 쉽죠?

던파 관련 자료는 아래 링크에서 찾으실 수 있습니다.
http://ottd.iruis.net/~onionmen/dnf/


한번 재미있는 분야에 응용해보아요~~~ ^^

자주가는 me2day 의 검색창을 만들어봤습니다.
me2day 계정이 있으신분은 아래 링크로 가셔서 테스트 해보세요.

http://ottd.iruis.net/~onionmen/me2/test.php?me2id=자신의 미투 url 뒷자리
(ex : http://ottd.iruis.net/~onionmen/me2/test.php?me2id=sumanpark )
신고
Posted by onionmen

댓글을 달아 주세요

  1. 이전 댓글 더보기
  2. 와 신기해 2009.05.19 09:56 신고  댓글주소  수정/삭제  댓글쓰기

    좋은내용이내요 .. 이거있으면 검색 엄청 편리할듯 ㅋㅋ 아이템도 쉽게찾고

  3. 무헌~ 솔히야? 2009.05.19 16:03 신고  댓글주소  수정/삭제  댓글쓰기

    나 컴맹 ? ㅎㄷㄷ ;;

  4. 나도 컴맹.... 2009.05.19 16:45 신고  댓글주소  수정/삭제  댓글쓰기

    인가;; 무슨얘기인지 하나도 모르겠네염. 명색이 컴공과인데

  5. 네오플은 내용 알까? 2009.05.19 17:02 신고  댓글주소  수정/삭제  댓글쓰기

    네오플은 내용을 알고 오던을 띄운 걸까여 ???

  6. 이분이 네오플 직원 2009.05.19 17:15 신고  댓글주소  수정/삭제  댓글쓰기

    이분이 네오플직원인데 내용알까는 뭔 개소리인가여

  7. 미네르바 2009.05.19 17:46 신고  댓글주소  수정/삭제  댓글쓰기

    전 간이드북이있습니다 ㅎㅎ

  8. 바보들의 행진이구만 2009.05.19 18:23 신고  댓글주소  수정/삭제  댓글쓰기

    바보님들 .. 두뇌가 병X면 손발이 고생한다더니
    http://ottd.iruis.net/~onionmen/dnf/
    클어가서 툴바추가하세요

  9. 로드-나이트 2009.05.19 18:39 신고  댓글주소  수정/삭제  댓글쓰기

    어차피 홈피에서 게임접속하는 게임인데 던파에서는 별로 필요없는 기능같네요
    좋은 정보임에는 분명하지만...오던의 기준은 참...난해하군요

  10. 유고 걸 2009.05.19 19:12 신고  댓글주소  수정/삭제  댓글쓰기

    뭘까?

  11. BlogIcon 지나가는하천민 2009.05.19 20:45 신고  댓글주소  수정/삭제  댓글쓰기

    풉.길가던하천민도이해함ㅋ
    님들뭐임ㅋ

  12. 1234 2009.05.19 21:46 신고  댓글주소  수정/삭제  댓글쓰기

    결국 스크롤은 엄청난 속도로 내려오기 시작하는데..

  13. 2009.05.19 22:55  댓글주소  수정/삭제  댓글쓰기

    비밀댓글입니다

  14. Favicon of http://blog.naver.com/qlsngood BlogIcon Ziskad 2009.05.19 23:01 신고  댓글주소  수정/삭제  댓글쓰기

    ㅇㅅ ㅇ 음침님 블로그에서 본 그 양파맨님인거같군여?!
    위에 있는 식을 어디로 보내야하는지 잘 모르갰내욥 ㅠㅠ

  15. 네츠아이 2009.05.19 23:44 신고  댓글주소  수정/삭제  댓글쓰기

    음...페이지에 오류가 있습니다 뜨는데...어찌해야함 ㅠㅠ
    비주얼 서치만 안됨 ㅠ

  16. Ruid 2009.05.20 16:47 신고  댓글주소  수정/삭제  댓글쓰기

    이거 해논거 없애는 방법은 없나요

  17. =ㅅ= 2009.05.20 17:01 신고  댓글주소  수정/삭제  댓글쓰기

    어떤게 쓰는거야.............

  18. 이글 쓴사람 폅신 2009.05.22 18:51 신고  댓글주소  수정/삭제  댓글쓰기

    이딴게 왜 오던인지 모르겠네 ...

  19. 이해안되냐? 2009.05.23 19:22 신고  댓글주소  수정/삭제  댓글쓰기

    IE8 하루만 써보면 뭔얘긴지 다 안다.

  20. ㅋㅋ 2009.05.23 21:29 신고  댓글주소  수정/삭제  댓글쓰기

    ㅋㅋ 오던 추카

  21. Favicon of http://www.runpapa.com BlogIcon car 2011.06.21 06:33 신고  댓글주소  수정/삭제  댓글쓰기

    이거 해논거 없애는 방법은 없나요

이전버튼 1 이전버튼

블로그 이미지
손을 따뜻하게 만들어 주고 싶은 애인이 있습니다.
onionmen

달력

 « |  » 2017.12
          1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31            
DNS Powered by DNSEver.com

최근에 올라온 글

Yesterday140
Today80
Total1,625,715

티스토리 툴바