카카오 지도 api

카카오 개발자 사이트 회원가입 필요!

엄청 쉽다.

 

 

https://apis.map.kakao.com/web/sample/mapInfo/

 

 

 

<div id="map" style="width:450px;height:300px;"></div><br>

 

 

 

<script type="text/javascript"
src="//dapi.kakao.com/v2/maps/sdk.js?appkey=회원가입 필수!"></script>

<script th:inline="javascript">
//카카오 지도 사용하기
var container = document.getElementById('map');


var lati = /*[[${storeVO.storeLati}]]*/;
var longi = /*[[${storeVO.storeLongi}]]*/;

console.log(lati);
console.log(longi);


var options = {
center: new kakao.maps.LatLng(lati, longi),
/* https://map.kakao.com/?urlX=523954.0&urlY=1084098.0*/
level: 3
};

var map = new kakao.maps.Map(container, options);


//마커찍기
// 마커가 표시될 위치입니다
var markerPosition = new kakao.maps.LatLng(lati, longi);

// 마커를 생성합니다
var marker = new kakao.maps.Marker({
position: markerPosition
});

// 마커가 지도 위에 표시되도록 설정합니다
marker.setMap(map);

// 아래 코드는 지도 위의 마커를 제거하는 코드입니다
// marker.setMap(null);
</script>