[FAQ] 지도/로컬 API 문의 전 꼭 읽어 주세요.
https://devtalk.kakao.com/t/faq-api/125610
현재 카카오맵 API를 사용하고 있습니다.
마커 대신 커스텀 오버레이를 사용하고 있는데, 커스텀 오버레이를 클릭 시 밑에서 modal창이 올라오는 이벤트를 생성하고 싶습니다.
Test 버튼을 통해 modal이 성공적으로 올라오는 것은 성공하였으나, 커스텀 오버레이를 클릭 시 modal 창이 올라오지 않고 있습니다.
조언 부탁드리겠습니다!
const overlayContent = <div id="overlay_${element.name}" class="${styles.overlayContainer}" style="border-color: lightgray"> <div class="${styles.logoContainer}"> <img class="${styles.logo}" src=${seatImage} /> <h2 class="${styles.CafeName}">${element.name}</h2> </div> </div>;
const overlay = new kakao.maps.CustomOverlay({
content: overlayContent,
map: map,
position: new kakao.maps.LatLng(element.xmap, element.ymap),
});
kakao.maps.event.addListener(overlay, "click", function () {
setIsModalVisible(true); // 모달을 보이게 합니다.
setModalContent(element.name); // 클릭한 오버레이의 정보를 모달에 전달합니다. 이 부분은 필요에 따라 수정하면 됩니다.
});