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>
주소를 좌표로 변환하는 사이트