DEV Community

loading...
Cover image for ANDROID GOOGLE MAPS Marker Cluster

ANDROID GOOGLE MAPS Marker Cluster

rrtutors
I am an Android and Flutter Developer. Having 7+ Years of Experience in Mobile application development. Looking for article writers on my website.
Originally published at rrtutors.com ・2 min read

In this post we are going to learn about use of google maps marker clustering. when we requires to show a large number of marker points on the Google maps we will use the Marker Cluster in Android.

For this we are using the google maps marker Clustering Utility class

Cluster Maps Android

in the above image The number on a cluster indicates how many markers it contains. Once we zoom onto cluster location we’ll able see the markers. We can also show Current Location with Zoom Options

To work with Maps Clustering we will add below dependencies in build.gradle file

implementation 'com.google.maps.android:android-maps-utils:1.0.2'
implementation 'com.google.android.gms:play-services-maps:17.0.0'
Enter fullscreen mode Exit fullscreen mode

To add Marker as cluster the simplest way to show the cluster, first, we need to implement ClusterItem on our model class. Let’s create a simple User class that implements ClusterItem.

package com.rrtutors.googlemapcluster

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

class User constructor(username: String,latLng: LatLng,url :String): ClusterItem {

    var username=username;
    var url=url;
    var latLng=latLng;
    override fun getSnippet(): String {

        return "";
    }

    override fun getTitle(): String {

        return username;
    }

    override fun getPosition(): LatLng {
        return latLng;

    }


}
Enter fullscreen mode Exit fullscreen mode

This class we will be used to add for the maps

Let's add Cluster to marker by

private fun setUpClusterManager(googleMap: GoogleMap) {
        val clusterManager = ClusterManager<User>(applicationContext , googleMap)  // 3
        googleMap.setOnCameraIdleListener(clusterManager)
        val items = getItems()

        googleMap.moveCamera(CameraUpdateFactory.newLatLngZoom(items?.toList()?.get(6)?.latLng, 14.0f));
        clusterManager.addItems(items)  // 4
        clusterManager.cluster()  // 5
    }
Enter fullscreen mode Exit fullscreen mode

Read Complete example of Google Maps Cluster Android

Discussion (0)

Forem Open with the Forem app