카카오맵 마커와 텍스트 질문드립니다.
본문
카카오맵 마커와 텍스트 질문드립니다.
카카오맵 마커와 텍스트를 검색해보니까 정적인 지도만 나왔는데
원래 카카오맵 퍼오면 드래그하거나 마우스휠 돌리면 움직이는 동적인 지도가 나오잖아요
거기서는 마커와텍스트가 안되나요?
제가 소스를 넣어봤는데 마커와 텍스트가 안나와서요.
<script>
// 이미지 지도에 표시할 마커입니다
// 이미지 지도에 표시할 마커를 아래와 같이 배열로 넣어주면 여러개의 마커를 표시할 수 있습니다
var markers = [
{
position: new kakao.maps.LatLng(위도, 경도)
},
{
position: new kakao.maps.LatLng(위도, 경도),
text: '텍스트를 표시할 수 있어요!' // text 옵션을 설정하면 마커 위에 텍스트를 함께 표시할 수 있습니다
}
];
var mapContainer = document.getElementById('map'), // 이미지 지도를 표시할 div
mapOption = {
center: new kakao.maps.LatLng(위도, 경도), // 이미지 지도의 중심좌표
level: 3, // 이미지 지도의 확대 레벨
marker: markers // 이미지 지도에 표시할 마커
};
// 이미지 지도를 생성합니다
var map = new kakao.maps.Map(mapContainer, mapOption);
</script>
답변 1
// 마커가 표시될 위치입니다
var markerPosition = new kakao.maps.LatLng(위도, 경도);
// 마커를 생성합니다
var marker = new kakao.maps.Marker({
position: markerPosition
});
// 마커가 지도 위에 표시되도록 설정합니다
marker.setMap(map);
var iwContent = '<div style="padding:5px;">Hello World! <br><a href="https://map.kakao.com/link/map/Hello World!,33.450701,126.570667" style="color:blue" target="_blank">큰지도보기</a> <a href="https://map.kakao.com/link/to/Hello World!,33.450701,126.570667" style="color:blue" target="_blank">길찾기</a></div>', // 인포윈도우에 표출될 내용으로 HTML 문자열이나 document element가 가능합니다
iwPosition = new kakao.maps.LatLng(위도, 경도); //인포윈도우 표시 위치입니다
// 인포윈도우를 생성합니다
var infowindow = new kakao.maps.InfoWindow({
position : iwPosition,
content : iwContent
});
// 마커 위에 인포윈도우를 표시합니다. 두번째 파라미터인 marker를 넣어주지 않으면 지도 위에 표시됩니다
infowindow.open(map, marker);
공식 문서
답변을 작성하시기 전에 로그인 해주세요.