지도 마커에 인포윈도우 배경 변경방법 문의드립니다

아래 코드는 지도 마커 인포윈도우 샘플 코드를 복사 해 온 것인데요.

인포윈도우 배경이 흰색이다보니 지도를 가리게 되어

투명하게 변경해보려는데 어떻게 해야하나요?

Screenshot_20201006-082430_NAVER

var mapContainer = document.getElementById(‘map’), // 지도를 표시할 div
mapOption = {
center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표
level: 3 // 지도의 확대 레벨
};

var map = new kakao.maps.Map(mapContainer, mapOption);

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

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

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

var iwContent = ‘

Hello World!
큰지도보기 길찾기
’, // 인포윈도우에 표출될 내용으로 HTML 문자열이나 document element가 가능합니다
iwPosition = new kakao.maps.LatLng(33.450701, 126.570667); //인포윈도우 표시 위치입니다

// 인포윈도우를 생성합니다
var infowindow = new kakao.maps.InfoWindow({
position : iwPosition,
content : iwContent
});

// 마커 위에 인포윈도우를 표시합니다. 두번째 파라미터인 marker를 넣어주지 않으면 지도 위에 표시됩니다
infowindow.open(map, marker);

인포윈도우는 내부적으로 스타일이 고정되어 있어 변경이 불가합니다.
content 내부 스타일을 자유롭게 적용할 수 있는 커스텀 오버레이로 구현해주세요.
http://apis.map.daum.net/web/sample/customOverlay2

친절한 답변 감사드립니다.

1개의 좋아요