Kakao
Maps API

Kakao 지도 Web API Wizard

접기
펼치기
가로
세로
레벨
지도 종류
+
  • 로드뷰
  • 지형도
  • 실시간교통
이미지 지도는 우측 지도를 이동/확대/축소 할 수 없으므로, 위도, 경도, 레벨 값을 직접 변경하셔야 합니다.
지도 옵션
지도 컨트롤
지도 이벤트 ?지도 이벤트 항목은 지도에서의 변화가 없으므로, 추가된 코드를 확인하세요.
접기
펼치기
  • 지도
  • 로드뷰 로드뷰를 추가하면 이용할 수 있습니다.
% 잘못된 URL 입니다.
상단 이미지 뷰어를 클릭해서 크로스 라인으로 표시되는 마커 기준점을 바꿀 수 있습니다. 마커가 원하는 위치에 표시되는지 오른쪽 지도에서 확인하세요.
마커 기준점 ? 지도상의 위치와 일치시킬 마커 이미지 좌표입니다. 상단 프리뷰 영역을 클릭해서 지정할 수도 있습니다.
x
상단 이미지 뷰어에서 마우스로 회색 사각형을 조절하여 원하는 영역만 마커로 사용할 수 있습니다. 아래 입력값을 수정해서 미세 조절할 수도 있습니다.
마커 크기 ? 마커이미지의 크기입니다. 로드된 이미지 크기와 다르게 설정하고 싶으신 경우 크기를 조정할 수 있습니다.
x
이미지위치 ? 스프라이트 이미지를 사용할 경우, 마커로 사용할 영역의 좌상단 좌표입니다.
x
마커 옵션 (지도에서)
마커 옵션 (로드뷰에서)
마커 이벤트 (지도에서) ? 마커 이벤트 항목은 지도에서의 변화가 없으므로, 추가된 코드를 확인하세요.
마커 이벤트 (로드뷰에서) ? 마커 이벤트 항목은 로드뷰에서의 변화가 없으므로, 추가된 코드를 확인하세요.
접기
펼치기
  • 지도
  • 로드뷰 로드뷰를 추가하면 이용할 수 있습니다.
HTML 코드 (지도에서)
컨텐츠의 위치 (지도에서)
HTML 코드 (로드뷰에서)
오버레이 옵션 (지도에서)
오버레이 옵션 (로드뷰에서)
커스텀오버레이는 HTML 자체에 이벤트를 적용할 수 있으므로, 별도의 이벤트를 제공하지 않습니다.
접기
펼치기
각 도형의 좌표나 크기는 임의로 지정되어 있습니다.
도형옵션
선스타일
도형 이벤트 ? 도형 이벤트 항목은 지도에서의 변화가 없으므로, 추가된 코드를 확인하세요.
선 투명도, 채움 투명도가 0이면 선과 도형 내부에서 마우스 이벤트가 발생하지 않습니다.
접기
펼치기
가로
세로
로드뷰 옵션
로드뷰 이벤트 ? 로드뷰 이벤트 항목은 로드뷰에서의 변화가 없으므로, 추가된 코드를 확인하세요.
접기
펼치기

API Wizard

지도 Web API의 주요 기능에 대한 코드를 자동으로 생성해주는 기능입니다. 생성된 코드를 직접 수정해서 확인하고 싶을 경우에는 '직접해보기'를 이용해 보세요. 보다 상세한 기능은 Sample과 Documentation을 참고하세요.
(지도나 로드뷰를 이동/확대/축소하면 왼쪽의 관련 옵션값도 함께 변경됩니다. 마커, 커스텀오버레이, 도형의 위치는 화면에서 바로 확인 가능하도록 지도 중심에 위치시키고 있습니다.)

직접 해보기