안드로이드 스튜디오 구글 맵 마커 묶어보여주기(클러스터 사용하기)

전 포스팅을 안보셨다면 먼저 보시는 것을 추천드립니다.

안드로이드 스튜디오 구글 맵에 마커 넣기

현재 어플의 실행화면을 보면 마커가 여러개 찍혀 보기에도 불편하고 어플 실행시에도 시간이 오래걸리게 됩니다.

이럴때 인접해있는 마커들을 묶어서 보여주는 클러스터 기능을 사용하려고 합니다.

 

먼저 상단의 File > Project Structure로 들어와서 Dependencies를 클릭해 줍니다. 그리고 Modules 아래의 +버튼을 눌러줍니다.

android-maps-utils라고 검색을 하면 최신 버전을 확인할 수 있습니다. OK를 눌러줍니다.

OK를 누르게 되면 코드에 추가 후 Sync까지 알아서 해줍니다.

이제 다음으로 ClustItem을 상속받는 MyItem이라는 클래스를 만들어줍니다.

package com.example.coronaclinicmap;

import com.google.android.gms.maps.model.LatLng;
import com.google.maps.android.clustering.ClusterItem;

public class MyItem implements ClusterItem{
    private final LatLng mPosition;
    private final String mTitle;

    public MyItem(double lat, double lng, String title) {
        mPosition = new LatLng(lat, lng);
        mTitle = title;
    }

    @Override
    public LatLng getPosition() {
        return mPosition;
    }

    @Override
    public String getTitle() {
        return mTitle;
    }

    @Override
    public String getSnippet() {
        return null;
    }
}

다음으로 구글맵을 띄우는 액티비티에 아래의 코드를 추가합니다.

public void onMapReady(final GoogleMap googleMap) {
        mgoogleMap = googleMap;
        clusterManager = new ClusterManager<>(this,mgoogleMap);

        mgoogleMap.setOnMapLoadedCallback(new GoogleMap.OnMapLoadedCallback() {
            @Override
            public void onMapLoaded() {
                Log.d(TAG, "Load");
                LatLng latLng = new LatLng(addrToPoint(context, "서울시청").getLatitude(), addrToPoint(context, "서울시청").getLongitude());
                mgoogleMap.moveCamera(CameraUpdateFactory.newLatLng(latLng));
                mgoogleMap.animateCamera(CameraUpdateFactory.zoomTo(9));
            }
        });

        mgoogleMap.setOnCameraIdleListener(clusterManager);
        mgoogleMap.setOnMarkerClickListener(clusterManager);

        for(int i = 0 ; i < clinics.size(); i++) {
            Location location = addrToPoint(context, clinics.get(i).getAddress());
            MyItem clinicItem = new MyItem(location.getLatitude(), location.getLongitude(),
                    clinics.get(i).getName());
            clusterManager.addItem(clinicItem);
        } // 병원 개수만큼 item 추가
        
        mgoogleMap.setOnInfoWindowClickListener(new GoogleMap.OnInfoWindowClickListener() {
            @Override
            public void onInfoWindowClick(Marker marker) {
                String marker_number = null;
                for(int i = 0 ; i < clinics.size() ; i++ ) {
                    if(clinics.get(i).findIndex(marker.getTitle()) != null) {
                        marker_number = clinics.get(i).findIndex(marker.getTitle());
                        Log.d(TAG, "marker_number " + marker_number);
                    }
                }
                final int marker_ID_number = Integer.parseInt(marker_number);
                Log.d(TAG, "marker number = " + String.valueOf(marker_ID_number));
                Log.d(TAG, "marker clinic name = " + clinics.get(marker_ID_number).getName());
                AlertDialog.Builder builder = new AlertDialog.Builder(context);
                builder.setTitle("병원정보");
                builder.setMessage(
                        "이름 : " + clinics.get(marker_ID_number-1).getName() +
                                "\n주소 : " + clinics.get(marker_ID_number-1).getAddress() +
                                "\n병원전화번호 : " + clinics.get(marker_ID_number-1).getPhoneNumber() +
                                "\n검체채취가능여부 : " + clinics.get(marker_ID_number-1).getSample()
                );
                builder.setPositiveButton("확인", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {

                    }
                });
                builder.setNegativeButton("전화걸기", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        // startActivity(new Intent(Intent.ACTION_DIAL, Uri.parse("tel" + clinics.get(Integer.parseInt(marker_ID_number)).getPhoneNumber())));
                    }
                });
                AlertDialog alertDialog = builder.create();
                alertDialog.show();
            }
        });// 마커 클릭 시 Alert Dialog가 나오도록 설정
    } // 구글맵 사용

묶여있는 클러스트를 클릭하면 클러스터 위치로 이동하고 확대되게 하기 위해선 아래와 같이 사용하면 됩니다.

clusterManager.setOnClusterClickListener(new ClusterManager.OnClusterClickListener<MyItem>() {
            @Override
            public boolean onClusterClick(Cluster<MyItem> cluster) {
                LatLng latLng = new LatLng(cluster.getPosition().latitude, cluster.getPosition().longitude);
                CameraUpdate cameraUpdate = CameraUpdateFactory.newLatLngZoom(latLng, 15);
                mgoogleMap.moveCamera(cameraUpdate);
                return false;
            }
        });

참고자료

- https://www.youtube.com/watch?v=Mz5z7sDkYOc&feature=youtu.be

- https://developers.google.com/maps/documentation/android-sdk/utility/marker-clustering

Google Maps Android Marker Clustering Utility  |  Maps SDK for Android