where 2.0 시대의강력한우군 야후야후 지도지도 ajax api 3 7ajax...

Where 2.0 시대의강력한우군

야후!지도 AJAX API 3 7야후! 지도 AJAX API 3.7

Yahoo! KoreaMap Engineering TeamMap Engineering Team

차례차례

• Where 2.0

• 야후! 지도 서비스

• 야후! 지도 AJAX API

– 준비 사항 및 배경 지식

– AJAX API 사용 방법

• 야후! 지도 관련 XML API

– 지역 명 검색 XML API

– 좌표, 지명 변환 XML API

– 좌표변환 XML API

• API 데모

• Q&A

Yahoo! Korea Engineering

Where 2.0

사용자 스스로 위치에 기반한 정보를 생산하고 소비하며 공유한다.

e e .0

Where 2.0 의 시대


야후! 지도야후! 지도

서비스 URL: http://kr.gugi.yahoo.com/map


야후! 코리아 글로벌 지도 서비스야후! 코리아 글로벌 지도 서비스

• 한국 및 전세계를 포함하는 지도 및 위성사진 데이터 제공

– 한국, 북미, 인도, 유럽 지역 국가에 대한 상세 지도 데이터

– 한국은 내년에 상세 위성사진 제공 예정

호주 대만을 시작 단계별 상세 데이터 추가 예정– 호주, 대만을 시작으로 단계별로 상세 데이터 추가 예정

• 전세계를 단일 국제 표준 좌표체계(WGS84)로 일원화

• 전세계 240여 개 국가의 행정구역, 지역 명, POI에 대한 좌표검색정보 제공

런던 에펠 탑 등 한국인에게 익숙한 지역에 대한 한국어 지명 검색– 런던, 에펠 탑 등 한국인에게 익숙한 지역에 대한 한국어 지명 검색

• 전세계 240여 개 국가에 대한 위경도 좌표로 행정구역을 검색

3천8백만 국내지번검색• 3천8백만 국내지번검색

• 브라우저 호환성

Fi f 2 IE 6/7 O 8 S f i 3 이상


– Firefox 2, IE 6/7, Opera 8, Safari 3 이상

야후! 지도의 지도학적 특성야후! 지도의 지도학적 특성

• UTM 지도 투영법

– 세계를 하나의 통일된 좌표로 표현

• WGS84 좌표 시스템

– 경도 범위 : -180˚ ~ +180˚

– 위도 범위 : -85˚ ~ +85˚

• 17단계 레벨의 지도 표현

– 각 레벨당 4(18-zoomlevel)개의 지도 타일 이미지 (256x256)

– 1레벨: 17,179,869,184 장의 타일 이미지로 구성(이론적 수치)


UTM (Universal Transverse Mercator Grid)U (U e sa a s e se e cato G d)

지구 전체를 평면상에 표현하는 가장 효과적인 지도 작성 방법

N85˚

그린란드면적 216만 6086㎢

+855˚ 적도도

0˚ -8

S85˚

85˚


S85

-180˚ GMT 0˚ +180˚

브리질면적 851만 4047㎢

지도 좌표 시스템지도 좌표 시스템

• WGS84 (World Geodetic System 84)지구의 질량중심을 원점으로 한 좌표체계– 지구의 질량중심을 원점으로 한 좌표체계

– 미군에서 GPS 시스템을 이용하면서 만들어진 군사용 좌표체계

– 야후! 지도 구글 지도에서 사용 중야후! 지도, 구글 지도에서 사용 중

• TM128 (카텍 좌표계)– 카텍 좌표계는 국내에서 CNS(Car Navigation System)용으로 개발된카텍 좌표계는 국내에서 CNS(Car Navigation System)용으로 개발된

직각 좌표체계

– 네이버 지도 에서 사용 중

• Congnamul TM (TM * 2.5)– 콩나물지도, 다음지도에서 사용중인 좌표계

제주도(마라도 포함) 울릉도 독도 백령도의 좌표를 육지게 가깝게– 제주도(마라도 포함), 울릉도, 독도, 백령도의 좌표를 육지게 가깝게옮겨 놓음


야후! 지도 AJAX API


야후! 지도 AJAX API의 특징야후! 지도 J 의 특징

• 100% JavaScript로 개발되어 브라우저 호환성이 뛰어남

• 전세계 단일 WGS84 좌표 체계

• 원하는 지역의 좌표를 찾기 위한 전세계 지역 명 검색(250만 건) XML API 제공XML API 제공

• 좌표를 지역으로 변환하는 XML API 제공

• 좌표 변환 XML API 제공

• I18N(InternationalizatioN)

– 독일, 프랑스, 중국, 중동 등의 다국어 지명을 표현하기 위하여 UTF-8 코드 사용


일일 허용 사용량일일 허용 사용량

• 일 사용량 제한 : 50,000 web request

– 사용자의 IP 주소 및 어플리케이션 ID 기반으로 과도한 요청을 제한

– 24시간 단위로 사용량 점검

• 일 사용량 제한을 초과하면 다음날 까지 API를 사용할 수 없다!!

• 일 제한 사용량을 초과해서 사용해야 할 필요가 있거나 상용 서비스에 사용할 경우 별도의 논의 필요


야후지도 지도 관련 용어 설명야후지도 지도 관련 용어 설명

MarkerTypeControlPanControl

DHTML 영역

ZoomControl

SmartWindowLabel


야후! 지도를 사용하기 위해 준비해야 할 것들야후! 지도를 사용하기 위해 준비해야 할 것들

• 개발에 필요한 기본 지식DHTML– DHTML

– JavaScript

– AJAXAJAX

– XML

– Unicode(UTF-8) : 다국어 지원(ex. München)( ) 다국어 지원( )

• 어플리케이션 ID 발급– 야후!의 모든 오픈 컨텐츠에 접근하기 위해서 어플리케이션 ID 필요

h //k i h /R i / i hhttp://kr.open.gugi.yahoo.com/Regist/regist.php

• 야후 지도 사용법개발자 tutorial– 개발자 tutorial http://kr.open.gugi.yahoo.com/document/tutorials.php

– 개발자 reference


http://kr.open.gugi.yahoo.com/document/reference.php

주요 classes주요 c assesClass Description

YMap 지도 영역을 관리YMap 지도 영역을 관리YMapTypeControl 지도상의 지도 유형 콘트롤 (지도, 하이브리드, 위성)을 조정YEvent 지도와 관련된 이벤트를 관리YPolyline 지도상에 선을 그리는데 필요한 라이브러리YPolyline 지도상에 선을 그리는데 필요한 라이브러리

YCustomOverlayYGeoPoint와 YCoordPoint클래스를 이용하여 지도상이나 지도영역에 오브젝트를 등록

YCoordPoint 지도 영역의 좌 상단으로 부터의 픽셀 좌표YCoordPoint 지도 영역의 좌 상단으로 부터의 픽셀 좌표YGeoPoint WGS84 좌표계를 따르는 GMT와 적도로 부터 시작하는 좌표Ymarker 지도상에 지점을 표시할 때 사용Yi 사용자 정의 이미지를 지도상에 표시할 때 사용Yimage 사용자 정의 이미지를 지도상에 표시할 때 사용YGeoRSS 좌표정보를 가지고 있는 RSS feed를 처리. (현재 야후코리아에서는 지원하지 않음)

YLog 디버깅을 편리하게 하기 위하여 사용YUtility 야후! 지도 API를 이용하여 개발할 때 사용되는 유틸리티 함수


웹 페이지에 지도 추가하기웹 페이지에 지도 추가하기

1. JavaScript 헤더파일을 HTML파일에 포함 시키기<script type="text/javascript" src="http://kr.open.gugi.yahoo.com/

Client/AjaxMap.php?v=3.7&appid=YahooDemo"></script>

2. HTML을 이용한 지도 영역 정의<div id="map" style="width:400px;height:300px"></div>

3. 지도 생성

4 지도 유형 선택

var map = new YMap(document.getElementById("map"));

4. 지도 유형 선택

지 시 위치 지정

map.setMapType(YAHOO_MAP_REG);

5. 지도표시 위치 지정var center_point = new YGeoPoint(37.511411132213,127.05925359288);map.drawZoomAndCenter(center point,3);


p ( _p , );

지도 추가 예제지도 추가 예제


지도상에 지점 추가지도상에 지점 추가

• 위치 표시 기준

– 지역명 검색 : 가장 정확도가 높은 지역 위치 선택

– YGeoPoint: GMT와 적도를 기준으로 한 WGS84 위경도 좌표

• 지역명을 이용한 지점 등록map.addMarker(encodeURIComponent("코엑스"));

• YGeoPoint 를 이용한 지점 등록var center_point = new YGeoPoint(37.511411132213,127.05925359288);

ddM k ( t i t)map.addMarker(center_point);


이벤트 처리이벤트 처리

• 주요 이벤트

– YMap 관련• endMapDraw, changeZoom, startPan, onPan, endPan, endAutoPan, startAutoPan, MouseClick,

MouseDown, MouseDoubleClick, MouseOut, MouseOver, MouseUp, KeyUp, KeyDown, onEndGeoCode, polylineAdded, polylineRemovedp y , p y

– YMarket 관련• openExpanded, closeExpanded, openSmartWindow, closeSmartWindow

• 이벤트 연결 방법YEvent.Capture(map, EventsList.endMapDraw,event_endMapDraw);

function event_endMapDraw() {

alert("endMapDraw event triggered!!"); }


디버깅? 디버깅!!디버깅? 디버깅!!

• YLog 를 이용한 쉬운 JavaScript 디버깅//call initPos to set the starting locationYLog.initPos(mapCoordCenter);

// Printing to the Logger// Printing to the LoggerYLog.print("You Made a MouseClick!");YLog.print("Latitude:" + _c.Lat);YLog.print("Longitude:" + _c.Lon);

• 실행 예


AJAX API 데모


야후! 지도 XML API


지역 명 검색 XML API지역 명 검색

• 개요

– POI (Point Of Interest)를 검색하고 선택된 지역의 WGS84 시스템 상의 경도와 위도를 돌려 준다.

• 요청 URL• 요청 URL

– http://kr.open.gugi.yahoo.com/service/poi.php

• 문서• 문서

– http://kr.open.gugi.yahoo.com/document/poisearch.php

사용 예• 사용 예

– http://kr.open.gugi.yahoo.com/service/poi.php?appid=YahooDemo&q=코엑스&output=xml&results=50q 엑 p

• 결과 형식

– XML, JSON, Serialized PHP String


, JSO , Se a ed St g

지역 명 검색 XML API 실행 예지역 명 검색 실행 예


좌표, 지명 변환 XML API좌표, 지명 변환

• 개요

– WGS84 위도, 경도 좌표를 지역명의 계층구조로 변환하는 XML API

• 요청 URL

– http://kr.open.gugi.yahoo.com/service/rgc.php

• 문서

– http://kr.open.gugi.yahoo.com/document/geocooder.php

• 사용 예

– http://kr.open.gugi.yahoo.com/service/rgc.php?appid=YahooDemo&latitude=37.4997677193116&longitude=127.0294189453125&output=xmlp

• 결과 형식

– XML, JSON, Serialized PHP String



좌표, 지명 변환 XML API 실행 예좌표, 지명 변환 실행 예


좌표 변환 API좌표 변환

• 개요서로 다른 좌표체계 간의 상호 변환하는 기능을 제공– 서로 다른 좌표체계 간의 상호 변환하는 기능을 제공

– TM, UTM, KTM, WGS84, BESSEL 지원

• 요청 URL• 요청 URL– http://kr.open.gugi.yahoo.com/service/coordconverter.php

• 문서문서– http://kr.open.gugi.yahoo.com/document/coordtrans.php

• 사용 예사용 예– http://kr.open.gugi.yahoo.com/service/coordconverter.php?appid=Y

ahooDemo&x=127.05590291409&y=37.507502379027&before=WGS&after=TM&output=xmlGS&after=TM&output=xml

• 결과 형식– XML, JSON, Serialized PHP String



좌표 변환 API 실행 예좌표 변환 실행 예


향후 지원 계획

• 컨텐츠 지원

향후 지원 계획

– 고해상도 위성지도 서비스 준비 중

– 한국 지번 검색 XML API (약 38,000,000 건) 제공 예정

한국 지역 검색 약 12 000 000 건 제공 예정– 한국 지역 검색 XML API (약 12,000,000 건) 제공 예정

– 야후! 내의 다양한 컨텐츠 제공 예정

개발 지원• 개발 지원

– 야후! 본사의 Global API 제공

YDN (htt //d l h ) API 및 t t 제공• YDN (http://developer.yahoo.com) API 및 contents 제공

– 개발자 지원

• 위치기반 정보 기술 지원• 위치기반 정보 기술 지원

• Mash-up 프로모션 지원 예정


참고 사이트참고 사이트

• 야후! 지도 API 한글 도움말 사이트

– http://kr.open.gugi.yahoo.com

• 야후! 지도 API 영문 도움말 사이트

– http://developer.yahoo.com/maps

• YUI (Yahoo! User Interface Library) 도움말 사이트

– http://developer.yahoo.com/yui


질문?


where 2.0 시대의강력한우군 야후야후 지도지도 ajax api 3 7ajax...

Documents