https://navermaps.github.io/maps.js/
예제 (업데이트가 안되어서 정보가 잘못되었다. 20190225)
https://navermaps.github.io/maps.js/docs/tutorial-2-Getting-Started.html
네이버 지도 클라우드 플랫폼
https://console.ncloud.com/mc/solution/naverService/application
예제코드
<script type="text/javascript" src="http://openapi.map.naver.com/openapi/v3/maps.js?ncpClientId=클라이언트아이디"></script> <div class="map_wrap"> <h1>오시는 길</h1> <div class="map_view"> <div id="map" style="width:100%;height:400px;"></div> <script> var map = new naver.maps.Map('map', { center: new naver.maps.LatLng(35.8469571,128.5805891), zoom: 11 }); var marker = new naver.maps.Marker({ position: new naver.maps.LatLng(35.8469571,128.5805891), map: map }); </script> </div> <div class="map_info_wrap"> <ul class="map_info"> <li><span>주소</span>서울시 중구 칠패로 27 포스코더샵 A동 412호</li> <li><span>전화</span>0507-1343- 5157</li> <li><span>팩스</span>0504-481-5157</li> </ul> </div> <h2>지하철 이용시</h2> <h3>1호선*4호선 서울역 하차후</h3> <div class="desc"> 3번출구 – 200m 직진 후 Wise Tower를 끼고 좌회전 후100m 직진 – 연세재단 봉래빌딩 주차장을 지나서 올라오셔서 전방 횐당보도를 건너면 왼쪽에 순화동 포스코 더샾 주상복합 건물 – 오피스 A동 412호 <br> * 떡복이 집과 편의점 사이에 있는 현관문 이용 </div> <h2>버스 이용시</h2> <h3>염천교 정류장</h3> <div class="desc"> <b>간선버스(파랑)</b> 173, 261, 262 <br> <b>지선버스(초록)</b> 7011, 7017</div> <h3>숭례문 정류장</h3> <div class="desc"> <b>간선버스(파랑)</b> 100, 103, 104, 105, 150, 151, 152, 162, 173, 201, 202, 261, 262, 400, 401, 405, 406,421, 471, 500, 501, 502, 504, 505, 506, 603, 701, 704 <br> <b>지선버스(초록)</b> 7017, 7021, 70226 </div> <h2>자가용 이용시</h2> <div class="desc">네비게이션에 “순화동 포스코 더샵” 또는 “라마다호텔엔스위트 남대문” 입력</div> </div> 주소를 좌표로 변환하는 사이트