중국의 넘보원 포털인 바이두 지도 서비스
http://map.baidu.com
바이두 지도 API 설명문서
首页- 百度地图API
- API 버전 2.0
- API 사용을 위한 키를 발급받아야 한다
구글 검색으로 바이두 지도 API 샘플 코드를 참조하여 작성하였다.
구글책 – Mapping in Cloud
제주도 관광 안내에 사용하기 위해 그랜드호텔을 Marker(POI)로 삽입했다.
- 제주도에 대해서 경로검색이 되지 않는다.
- 지도 뷰어 사용과 좌표값(lng,lat)에 의한 marker 지정이 가능하고
- 중국어/영어에 의한 POI 검색이 된다 (<– 안해봤음 -_-;)
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=927cb23887926d2b345b0c762045feb3"></script> <title>Baidu Map</title> <script type="text/javascript"> function initialize() { var map = new BMap.Map("allmap"); map.addControl(new BMap.NavigationControl()); map.addControl(new BMap.ScaleControl()); map.addControl(new BMap.OverviewMapControl()); map.enableScrollWheelZoom(); map.addControl(new BMap.MapTypeControl()); map.setCurrentCity("济州"); map.centerAndZoom(new BMap.Point( 126.479, 33.485), 14); var marker = new BMap.Marker(new BMap.Point( 126.488685, 33.485293)) map.addOverlay(marker); marker.setAnimation(BMAP_ANIMATION_BOUNCE); var infoWindow = new BMap.InfoWindow("Info: 제주 그랜드 호텔 <br>(테스트)"); infoWindow.setTitle("Title: 제주관광안내") marker.addEventListener("click", function() { this.openInfoWindow( infoWindow); }); return map; } function alertPoint() { var coor = map.getCenter(); console.log( "lng="+coor.lng+", lat="+coor.lat+", (zoom="+map.getZoom()+")" ); alert( "lng="+coor.lng+", lat="+coor.lat+", (zoom="+map.getZoom()+")" ); } var map; console.log( "BAIDU Map - version 2.0" ); console.log( "=========================" ); </script> </head> <body onLoad="map = initialize()"> <div id="allmap" style="width:1000px; height:600px"></div> <p> </p> <button onclick="alertPoint()">getCenter()</button> </body> </html>
안녕하세요 참고해서 바이두 지도를 넣어 볼수 있었습니다. 그런데.. ㅠㅠ 제가 원하는 좌표로 해서 넣으면 표출이 안되는데 설명도 함께 넣어 주시면 안될까요?? ㅠㅠ 아니면 제가
좋아요좋아요