FrontEngineer JungBam

카카오 MAPS API 사용하기 본문

개발일지

카카오 MAPS API 사용하기

정밤톨 2022. 11. 15. 18:04

 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Kakao 지도 시작하기</title>
  </head>
  <body>
    <div id="map" style="width: 500px; height: 400px;">하이</div>
    <script
      type="text/javascript"
      src="//dapi.kakao.com/v2/maps/sdk.js?appkey=e3bbeb21c6c5966adffc8f5be0cbef3a"
    ></script>
    <script>
      var container = document.getElementById('map')
      var options = {
        center: new kakao.maps.LatLng(33.450701, 126.570667),
        level: 3,
      }

      var map = new kakao.maps.Map(container, options)
    </script>
  </body>
</html>

카카오 MAPS API를 이용해 맵 자체를 불러오는 건 매우 간단한 일이었다.

중요할 것은 스크립트가 작동하는 순서!!

카카오 맵 가이드에 있는 샘플만 따라해도 왠만한 기능은 다 구현이 가능했다.

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

반응형
Comments