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 32 33 34 35 36 37 38 39 40 41 | <!-- html tag --> <div id="map" style="width:500px;height:500px;"></div> <!-- script --> <script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=발급받은자바스크립트키&libraries=services,clusterer"></script> <script type="text/javascript"> var container = document.getElementById('map'); //지도를 담을 영역의 DOM 레퍼런스 var options = { //지도를 생성할 때 필요한 기본 옵션 center: new daum.maps.LatLng(33.450701, 126.570667), //지도의 중심좌표. level: 3 //지도의 레벨(확대, 축소 정도) }; var map = new daum.maps.Map(container, options); //지도 생성 및 객체 리턴 // 주소-좌표 변환 객체를 생성합니다 var geocoder = new daum.maps.services.Geocoder(); // 주소로 좌표를 검색합니다 geocoder.addressSearch('제주특별자치도 제주시 영평동', function(result, status) { // 정상적으로 검색이 완료됐으면 if (status === daum.maps.services.Status.OK) { var coords = new daum.maps.LatLng(result[0].y, result[0].x); // 결과값으로 받은 위치를 마커로 표시합니다 var marker = new daum.maps.Marker({ map: map, position: coords }); // 지도의 중심을 결과값으로 받은 위치로 이동시킵니다 map.setCenter(coords); } }); </script> | cs |
'작업' 카테고리의 다른 글
ie background - position에서의 calc() 계산식 오류 (0) | 2019.05.15 |
---|---|
air datepicker 시작일 종료일 minDate, MaxDate 제어 (0) | 2019.04.30 |
GSAP + ScrollMagic 사용법 (0) | 2019.04.29 |
카카오맵 클릭했을때 지도 위치 변경 (0) | 2019.03.15 |
가로세로 비율을 유지하는 반응형 박스 (0) | 2019.03.13 |