[API] 카카오맵 API

카카오맵 API

카카오맵 지도 API

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

- 어디에서든 많이 쓰고 있는 카카오맵 API이다.

- 장소에 대해 마커를 찍어 지도를 보여줄 수 있다.

시작하는 방법

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

- 가이드에 나와있듯이 시작하기에 앞서서 먼저 카카오 개발자 사이트에 들어가서 JavaScript API를 발급받아야 한다.

- 그 다음 가이드에 나온데로 진행하면 된다.

실제 지도를 그리는 Javascript API를 불러오기

<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=발급받은 APP KEY를 넣으시면 됩니다."></script>

실제로 지도를 띄우는 코드

<!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=발급받은 APP KEY를 넣으시면 됩니다."></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>

라이브러리 사용

Kakao 지도 Javascript API 는 지도와 함께 사용할 수 있는 라이브러리를 지원하고 있습니다.
라이브러리는 javascript API와 관련되어 있지만 조금 특화된 기능을 묶어둔 것을 말합니다. 이 기능은 추가로 불러와서 사용할 수 있도록 되어있습니다.
현재 사용할 수 있는 라이브러리는 다음과 같습니다.

clusterer: 마커를 클러스터링 할 수 있는 클러스터러 라이브러리 입니다.
services: 장소 검색 과 주소-좌표 변환 을 할 수 있는 services 라이브러리 입니다.
drawing: 지도 위에 마커와 그래픽스 객체를 쉽게 그릴 수 있게 그리기 모드를 지원하는 drawing 라이브러리 입니다.

라이브러리 불러오기

<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=APIKEY&libraries=LIBRARY"></script>

<!-- services 라이브러리 불러오기 -->
<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=APIKEY&libraries=services"></script>

<!-- services와 clusterer, drawing 라이브러리 불러오기 -->
<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=APIKEY&libraries=services,clusterer,drawing"></script>

예제 및 사용

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

- 예제는 사이트에 나와있듯이 엄청나게 많다.

- 원하는 예제에 들어가서 코드를 분석해 사용하면 된다.

저작자표시

'API' 카테고리의 다른 글

[API] slick 슬라이더 (0)	2023.05.29
[API] 문자메시지 API(coolsms) (0)	2022.08.18
[API] 주소 찾기 API(카카오 우편번호 서비스) (0)	2022.05.26
[API] API란? (0)	2022.05.24