안녕학세요 클러스터 관련질문입니다

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

지도/로컬 API에 대한 문의게시판입니다.

안녕하세요 혹시 클러스터 클릭이벤트를 이용하려 하는데…

클릭하며 확대가 되고있습니다.

클릭하면 숫자의 해당 마케들이 무엇인지 어떻게 확인하나요…?

예를들어 16 을 클릭시 확대가 아니라 16개 항목 정보를 보고싶습니다. ^^

알려주시면 감사하겠습니다…

2

클릭한 클러스터러의 마커들의 정보는
클릭 이벤트 안에서 cluster.getMarkers(); 를 호출하여 가져올 수 있습니다.

kakao.maps.event.addListener(clusterer, 'clusterclick', function(cluster) {
	var markers = cluster.getMarkers(); // 클러스터에 포함된 마커들을 배열로 반환한다.
    for(var i=0; i<markers.length; i++){
    	var marker = markers[i]; // 마커            
    }
});
3

네 해결했습니다. 감사합니다.

7: {LAT: “37.57900515037716”, LNG: “127.04302394963331”, NAME: “빈점포(공실)”, JUMID: “77”, IMG: “/mobile/images/slease.png”}
8: {LAT: “37.57894747026165”, LNG: “127.04306920000818”, NAME: “빈점포(공실)”, JUMID: “76”, IMG: “/mobile/images/sell.png”}
9: {LAT: “37.591748740726736”, LNG: “127.05210313580051”, NAME: “빈점포(공실)”, JUMID: “75”, IMG: “/mobile/images/lease.png”}
10: {LAT: “37.569765360117536”, LNG: “127.05010464185966”, NAME: “빈점포(공실)”, JUMID: “74”, IMG: “/mobile/images/lease.png”}
11: {LAT: “37.47857144711541”, LNG: “127.04529980624396”, NAME: “빈점포(공실)”, JUMID: “73”, IMG: “/mobile/images/sell.png”}
12: {LAT: “37.4919625270169”, LNG: “127.05709508991731”, NAME: “빈점포(공실)”, JUMID: “72”, IMG: “/mobile/images/sell.png”}
13: {LAT: “37.57371445476891”, LNG: “126.98724903975784”, NAME: “빈점포(공실)”, JUMID: “71”, IMG: “/mobile/images/give.png”}

혹시 q {m: {…}, Wa: 0, k: R, xa: 0, Da: 500, …} 이렇게 출력되는데

lat 와 lng을 출력하는것도 이해했습니다.

근데 NAME, JUMID를 출력하려면 어떻게 해야하나요…? 혼자 공부하면서 하는거라 ^^ 어떻게 출력하는지 잘모르겠네요 … 알려주시면감사하겠습니다.

4

marker의 객체 확장으로 넣은 데이터를 아래와 같이 불러올 수 있습니다.
코드 참고해주세요.

var markers = [];

var list = [
    {LAT: '37.57900515037716', LNG: '127.04302394963331', NAME: '빈점포(공실)', JUMID: '77', IMG: '/mobile/images/slease.png'},
    {LAT: '37.57894747026165', LNG: '127.04306920000818', NAME: '빈점포(공실)', JUMID: '76', IMG: '/mobile/images/sell.png'},
    {LAT: '37.591748740726736', LNG: '127.05210313580051', NAME: '빈점포(공실)', JUMID: '75', IMG: '/mobile/images/lease.png'},
    {LAT: '37.569765360117536', LNG: '127.05010464185966', NAME: '빈점포(공실)', JUMID: '74', IMG: '/mobile/images/lease.png'},
    {LAT: '37.47857144711541', LNG: '127.04529980624396', NAME: '빈점포(공실)', JUMID: '73', IMG: '/mobile/images/sell.png'},
    {LAT: '37.4919625270169', LNG: '127.05709508991731', NAME: '빈점포(공실)', JUMID: '72', IMG: '/mobile/images/sell.png'},
    {LAT: '37.57371445476891', LNG: '126.98724903975784', NAME: '빈점포(공실)', JUMID: '71', IMG: '/mobile/images/give.png'}
];

for(var i=0;i<list.length; i++) {
    var data = list[i];
    var marker = new kakao.maps.Marker({
        position: new kakao.maps.LatLng(data.LAT, data.LNG)
    });

    // 마커 객체 확장
    marker.name = data.NAME; 
    marker.jumid = data.JUMID;
    
    markers.push(marker);
}

clusterer.addMarkers(markers);

// 마커 클러스터러에 클릭이벤트를 등록합니다.
kakao.maps.event.addListener(clusterer, 'clusterclick', function(cluster) {
	var markers = cluster.getMarkers(); // 클러스터에 포함된 마커들을 배열로 반환한다.
    for(var i=0; i<markers.length; i++){
		var marker = markers[i]; // 마커          
        console.log(marker.name, marker.jumid); // name, jumid 정보 출력
    }
});