마커 클러스터 사용시 마커 커스텀오버레이 미노출 방법

카카오맵 API (지도/로컬)
1

[FAQ] 지도/로컬 API 문의 전 꼭 읽어 주세요.
https://devtalk.kakao.com/t/faq-api/125610

  1. 커스텀 오버레이로 마커 태그를 생성
  2. 클러스터 기능사용

맵 줌이벤트로 클러스터로 마커들이 묶였을 때 해당 마커를 바라보고 있는 태그 커스텀오버레이를 같이 display:none 처리를 하려면 어떻게 해야하나요?
클러스터함수에 콜백기능이 있을까요??

—아래—
간단한 코드 정보

//마커 데이터 변수
markerList : {
  tag : {},          // 마커 태그 커스텀 오버레이
  markers : {},    // 카카오 api 마커 객체
  overlay : {},    // 마커의 커스텀오버레이 정보창
  info : {},         // 마커에 대한 db정보
  markerKey : '' // 마커 식별자
}
...
...
// 클러스터 객체 생성
      this.clusterer = new kakao.maps.MarkerClusterer({
          map: this.map, // 마커들을 클러스터로 관리하고 표시할 지도 객체 
          averageCenter: true, // 클러스터에 포함된 마커들의 평균 위치를 클러스터 마커 위치로 설정 
          minLevel: 10 // 클러스터 할 최소 지도 레벨 
      });
      
      const arr = []
      this.markerList .forEach(item => {
        arr.push(item.markers)
      })
      this.clusterer.addMarkers(arr);

클러스터 동작 시 마커들은 클러스터로 묶여서 잘들어가나 태그는 그대로 남아있는 문제가 있습니다.
클러스터 기능으로 동적으로 커스텀오버레이를 숨길수있는 방법이 있을까요?

2

마커 클러스터에 커스텀 오버레이도 추가해서 관리하거나
clustered 이벤트에서 클러스터러의 마커 정보와 매칭되는 overlay를 지도에서 삭제하는 방식으로 구현할 수 있습니다.

kakao.maps.event.addListener( clusterer, 'clustered', function( clusters ) {
    for(const cluster of clusters) {
        console.log( cluster.getMarkers() ); // 클러스터에 포함된 마커 배열
        //클러스터 마커를 활용해서 매칭되는 overlay 삭제 (overlay.setMap(null);)
        //https://apis.map.kakao.com/web/documentation/#CustomOverlay_setMap
    }
});
3

클러스터러 처리된 경우 정상적으로 오버레이가 지워지는것을 확인했습니다.
다시 줌하여 클러스터러가 해제되었을 때 해제된 클러스터러의 마커들은 원래상태로 되돌려야하는데요(오버레이 노출)
관련하여 이벤트가 있을까요? clusterclick이벤트가 아닌 마우스 줌으로 해제된 경우입니다.
zoom_changed를 사용해서 데이터를 다시 설정하는 방법밖에없나요?

4

아뇨 현재 말씀하신 이벤트는 없습니다.
clustered 이벤트가, 마우스로 줌in-out, map center changed 와 같은 지도 중심점이 바뀔때마다 재연산을 수행하기에 지속적으로 발생합니다.

다만 현재로써는 말씀하신 지도가 확대됬을때, 클러스터링이 되지 않은 마커들의 정보를 알 수 있는 API나 이벤트는 없습니다.