지도 원점에 대해서

안녕하십니까!
아래에 이미지를 보면~ 원으로 그려진게 보이잖아요
이걸 클릭 하면 오른쪽에 데이터 변화 시키고 싶은데 (오른쪽에 말한건 제가 구현한건데요)
원점을 클릭하게되면 여기서 좌표를 보고싶거든요
알아보니까 clusterclick 이벤트가 있다고 해서 여기까지 이벤트 처리는 했어요
클릭한 좌표를 가져오는데 아래 소스 처럼 방법이 아닌것 같아서… 질문 드립니다.
좌표 구하는 방법을 가르쳐주시면 감사하겠습니다 :grinning:

    kakao.maps.event.addListener(kakaoMarkerCluster, 'clusterclick', function(cluster) {
     latlng_bounds = cluster.getBounds();
                        latlng_north_east = latlng_bounds.getNorthEast();
                        latlng_south_west = latlng_bounds.getSouthWest();
                        max_map_latitude = latlng_north_east.getLat();
                        max_map_longitude = latlng_north_east.getLng();
                        min_map_latitude = latlng_south_west.getLat();
                        min_map_longitude = latlng_south_west.getLng();
                        kakaoMapLevel = kakaoMap.getLevel();
})

스크린샷 2021-12-01 오후 10.00.15

clusterclick 이벤트에서는 클릭된 클러스터러의 정보를 구할 수 있지만 클릭한 위치는 알 수 없습니다.
아래와 같이 clustered 이벤트를 등록하고 생성된 클러스터러 오버레이에
직접 클릭 이벤트를 등록해서 좌표를 구할 수 있습니다.

//지도의 좌표 변환 객체
var mapProjection = map.getProjection();

kakao.maps.event.addListener( clusterer, 'clustered', function( clusters ) {
    clusters.forEach(cluster => {
        //클러스터러 오버레이를 가져옵니다.
        var overlay = cluster.getClusterMarker().getContent();

        // 각 클러스터의 overlay에 click 이벤트를 등록합니다.
        overlay.addEventListener('click', function(event) {
            //마우스 x, y 위치의 좌표를 가져옵니다.
            var {clientX, clientY} = event;
            var latlng = mapProjection.coordsFromContainerPoint(new kakao.maps.Point(clientX, clientY)); // 화면 좌표에 해당하는 지도 좌표
            console.log(latlng);
        });
    });
});

disableClickZoom: true 옵션을 추가하고 위에 있는 예제를 그대로 가져다가 테스트 했는데
아무 반응이 없습니다~ 어떻게 된건가요…

마커 클러스터러 사용하기 - Kakao 지도 Web API 예제 참고해서
클러스터러 생성 시 disableClickZoom: true 속성을 추가하고
위 코드 첨부하면 클러스터러 클릭 시 콘솔에 클릭한 좌표가 출력되는데요.
클릭한 좌표를 콘솔로 출력만 한 로직이기 때문에 다른 동작은 없습니다.
콘솔창에서 좌표가 출력되는지 확인해주세요.

다른 방법을 찾아서 해결 했습니다~ 답변 주셔서 감사해요~ :grinning_face_with_smiling_eyes:

1개의 좋아요