안녕하세요.
클러스터링이 완료됐을 때 마커의 배경을 제가 원하는 이미지로 커스텀할 수 있는지 궁금하여 문의드립니다.!
위 이미지 처럼 클러스터링 됐을 때 배경을 아래 인스타 처럼 이미지를 두고 마커 개수를 이미지 위에 올릴 수 있나요??
감사합니다~!!
위 이미지 처럼 클러스터링 됐을 때 배경을 아래 인스타 처럼 이미지를 두고 마커 개수를 이미지 위에 올릴 수 있나요??
clusterer.setStyles(styles); API를 이용해서 클러스터에 스타일을 적용할 수 있습니다.
문서 참고해주세요.
https://apis.map.kakao.com/web/documentation/#MarkerClusterer_setStyles
감사합니다!
말씀주신 setStyles를 사용하면 고정된 이미지가 나오게 되는데, 혹시 클러스터링 되는 데이터 중에 하나의 이미지를 backgroundImage로 설정하고 싶습니다.
위 이미지 처럼 클러스터링 된 데이터 중에 하나의 이미지를 보여지도록 구현하고 싶습니다!!
마커 클러스터링은 커스텀 오버레이로 구현되어 있어 오버레이에 직접 스타일을 설정할 수 있습니다.
클러스터링이 완료된 후 각 클러스터러의 오버레이에 스타일 속성을 설정해주세요.
//클러스터링이 완료되었을 때 발생하는 이벤트
kakao.maps.event.addListener( clusterer, 'clustered', function( clusters ) {
clusters.forEach(cluster => {
const clusterOverlay = cluster.getClusterMarker(); //마커 클러스터 오버레이
const content = clusterOverlay.getContent();
content.style.background = 'url(“”)' //클러스터러에 적용할 배경 스타일을 설정해주세요. backend외 style 속성도 설정 가능합니다.
});
});
https://apis.map.kakao.com/web/documentation/#Cluster_getClusterMarker
https://apis.map.kakao.com/web/documentation/#CustomOverlay
https://apis.map.kakao.com/web/documentation/#MarkerClusterer_clustered
https://apis.map.kakao.com/web/documentation/#Cluster_getMarkers
감사합니다!!
1개의 좋아요