Google Haritalar Android İşaretçi Kümeleme Yardımcı Programı

Platform seçin: Android iOS JavaScript

İşaretçilerinizi gruplandırarak, haritanın okunmasını zorlaştırmadan bir haritaya çok sayıda işaretçi yerleştirebilirsiniz.

Giriş

Bu videoda verileriniz harita üzerinde çok sayıda veri noktası gerektirdiğinde işaretçi kümeleme kullanımı açıklanmaktadır.

İşaretçi kümeleme yardımcı programı, farklı yakınlaştırma düzeylerinde birden çok işaretçiyi yönetmenize yardımcı olur. Daha kesin belirtmek gerekirse, 'items' bu noktada gerçekten 'items' olurlar ve sadece oluşturulduklarında 'Markers' olurlar. Ancak daha net bir ifadeyle, bu belge bunlara aynı zamanda 'işaretçiler' adını verecek.

Bir kullanıcı haritayı yüksek bir yakınlaştırma düzeyinde görüntülediğinde, harita üzerinde bağımsız işaretçiler gösterilir. Kullanıcı haritayı uzaklaştırdığında işaretçiler bir araya gelerek haritayı görüntülemeyi kolaylaştırır. İşaretçi kümeleme yardımcı programı, Android için Yardımcı Program Kitaplığı Haritalar SDK'sının bir parçasıdır. Kitaplığı henüz kurmadıysanız bu sayfanın geri kalanını okumadan önce kurulum kılavuzunu uygulayın.

Kümelenmiş işaretçileri olan bir harita
Kümelenmiş işaretçiler

İşaretçi kümeleme yardımcı programını kullanmak için işaretçileri ClusterManager nesnesine ClusterItem nesneleri olarak eklemeniz gerekir. ClusterManager, işaretçileri Algorithm kümesine geçirir. Bu işlem, işaretçileri bir dizi kümeye dönüştürür. ClusterRenderer, küme ve bağımsız işaretçileri ekleyip kaldırarak oluşturma işlemini yürütür. ClusterRenderer ve Algorithm takılabilir ve özelleştirilebilir.

Yardımcı program kitaplığı, işaretçi kümeleme yardımcı programının örnek uygulamalarını sağlayan bir demo uygulamasıyla birlikte gelir. Demo uygulamasının çalıştırılmasıyla ilgili yardım için kurulum kılavuzuna bakın. Demo uygulaması aşağıdaki işaretçi kümeleme örneklerini içerir:

  • ClusteringDemoActivity: İşaretçi kümelemesini gösteren basit bir etkinlik.
  • BigClusteringDemoActivity: 2.000 işaretçiyle kümeleme.
  • CustomMarkerClusteringDemoActivity: Kümelenmiş işaretçiler için özel tasarım oluşturma.

Basit işaretçi kümeleyici ekleme

On adımdan oluşan basit bir küme oluşturmak için aşağıdaki adımları izleyin. Gösterilen veya kümelenen işaretçilerin sayısı yakınlaştırma düzeyine göre değişse de sonuç şöyle görünür:

On adet kümelenmiş işaretçisi olan bir harita
On adet kümelenmiş işaretçi

Gerekli adımların özeti aşağıda verilmiştir:

  1. Haritadaki bir işaretçiyi temsil etmek için ClusterItem uygulayın. Küme öğesi, işaretçinin konumunu bir LatLng nesnesi ve isteğe bağlı bir başlık veya snippet olarak döndürür.
  2. Küme öğelerini (işaretçiler) yakınlaştırma düzeyine göre gruplandırmak için yeni bir ClusterManager ekleyin.
  3. ClusterManager dinleyiciyi uyguladığı için haritanın OnCameraIdleListener() özelliğini ClusterManager olarak ayarlayın.
  4. İşaretçi tıklama etkinliğine yanıt olarak belirli bir işlev eklemek istiyorsanız ClusterManager işleyiciyi uyguladığı için haritanın OnMarkerClickListener() özelliğini ClusterManager olarak ayarlayın.
  5. İşaretçileri ClusterManager içine besleyin.

Adımları daha ayrıntılı olarak inceleyin: On adetlik işaretçimizden oluşan basit bir küme oluşturmak için önce ClusterItem etiketini uygulayan bir MyItem sınıfı oluşturun.

Java


public class MyItem implements ClusterItem {
    private final LatLng position;
    private final String title;
    private final String snippet;

    public MyItem(double lat, double lng, String title, String snippet) {
        position = new LatLng(lat, lng);
        this.title = title;
        this.snippet = snippet;
    }

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

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

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

    @Nullable
    @Override
    public Float getZIndex() {
        return 0f;
    }
}

      

Kotlin


inner class MyItem(
    lat: Double,
    lng: Double,
    title: String,
    snippet: String
) : ClusterItem {

    private val position: LatLng
    private val title: String
    private val snippet: String

    override fun getPosition(): LatLng {
        return position
    }

    override fun getTitle(): String {
        return title
    }

    override fun getSnippet(): String {
        return snippet
    }

    override fun getZIndex(): Float {
        return 0f
    }

    init {
        position = LatLng(lat, lng)
        this.title = title
        this.snippet = snippet
    }
}

      

Harita etkinliğinize, ClusterManager ekleyin ve küme öğelerini besleyin. ClusterManager türünün MyItem türünde olduğunu belirten type bağımsız değişkenine <MyItem> dikkat edin.

Java


// Declare a variable for the cluster manager.
private ClusterManager<MyItem> clusterManager;

private void setUpClusterer() {
    // Position the map.
    map.moveCamera(CameraUpdateFactory.newLatLngZoom(new LatLng(51.503186, -0.126446), 10));

    // Initialize the manager with the context and the map.
    // (Activity extends context, so we can pass 'this' in the constructor.)
    clusterManager = new ClusterManager<MyItem>(context, map);

    // Point the map's listeners at the listeners implemented by the cluster
    // manager.
    map.setOnCameraIdleListener(clusterManager);
    map.setOnMarkerClickListener(clusterManager);

    // Add cluster items (markers) to the cluster manager.
    addItems();
}

private void addItems() {

    // Set some lat/lng coordinates to start with.
    double lat = 51.5145160;
    double lng = -0.1270060;

    // Add ten cluster items in close proximity, for purposes of this example.
    for (int i = 0; i < 10; i++) {
        double offset = i / 60d;
        lat = lat + offset;
        lng = lng + offset;
        MyItem offsetItem = new MyItem(lat, lng, "Title " + i, "Snippet " + i);
        clusterManager.addItem(offsetItem);
    }
}

      

Kotlin


// Declare a variable for the cluster manager.
private lateinit var clusterManager: ClusterManager<MyItem>

private fun setUpClusterer() {
    // Position the map.
    map.moveCamera(CameraUpdateFactory.newLatLngZoom(LatLng(51.503186, -0.126446), 10f))

    // Initialize the manager with the context and the map.
    // (Activity extends context, so we can pass 'this' in the constructor.)
    clusterManager = ClusterManager(context, map)

    // Point the map's listeners at the listeners implemented by the cluster
    // manager.
    map.setOnCameraIdleListener(clusterManager)
    map.setOnMarkerClickListener(clusterManager)

    // Add cluster items (markers) to the cluster manager.
    addItems()
}

private fun addItems() {

    // Set some lat/lng coordinates to start with.
    var lat = 51.5145160
    var lng = -0.1270060

    // Add ten cluster items in close proximity, for purposes of this example.
    for (i in 0..9) {
        val offset = i / 60.0
        lat += offset
        lng += offset
        val offsetItem =
            MyItem(lat, lng, "Title $i", "Snippet $i")
        clusterManager.addItem(offsetItem)
    }
}

      

Yakınlaştırma ve uzaklaştırma yaparken kümeleme animasyonlarını devre dışı bırakmayı da seçebilirsiniz. Animasyon kapalıysa işaretçiler kümelerin içine ve dışına taşımak yerine yerine sabit kalır. Animasyonları devre dışı bırakmak için ClusterManager içinde setAnimation() özelliğini aşağıda gösterildiği gibi kullanın:

Java


clusterManager.setAnimation(false);

      

Kotlin


clusterManager.setAnimation(false)

      

Kümelenmiş tek bir işaretçi için bilgi penceresi ekleme

Belirli kümelenmiş işaretçiler için bir bilgi penceresi eklemek üzere ClusterItem uygulamanızın yapısına başlık ve snippet dizeleri ekleyin.

Aşağıdaki örnekte bir başlık ve snippet ayarlayarak addItems() yönteminde bilgi penceresi olan bir işaretçi ekler:

Java


// Set the lat/long coordinates for the marker.
double lat = 51.5009;
double lng = -0.122;

// Set the title and snippet strings.
String title = "This is the title";
String snippet = "and this is the snippet.";

// Create a cluster item for the marker and set the title and snippet using the constructor.
MyItem infoWindowItem = new MyItem(lat, lng, title, snippet);

// Add the cluster item (marker) to the cluster manager.
clusterManager.addItem(infoWindowItem);

      

Kotlin


// Set the lat/long coordinates for the marker.
val lat = 51.5009
val lng = -0.122

// Set the title and snippet strings.
val title = "This is the title"
val snippet = "and this is the snippet."

// Create a cluster item for the marker and set the title and snippet using the constructor.
val infoWindowItem = MyItem(lat, lng, title, snippet)

// Add the cluster item (marker) to the cluster manager.
clusterManager.addItem(infoWindowItem)

      

İşaretçi kümelerini özelleştirin

ClusterManager oluşturucu, DefaultClusterRenderer ve NonHierarchicalDistanceBasedAlgorithm oluşturur. ClusterManager için setAlgorithm(Algorithm<T> algorithm) ve setRenderer(ClusterRenderer<T> view) yöntemlerini kullanarak ClusterRenderer ve Algorithm ayarlarını değiştirebilirsiniz.

Kümelerin oluşturulmasını özelleştirmek için ClusterRenderer uygulayabilirsiniz. DefaultClusterRenderer, başlamak için iyi bir taban sağlar. DefaultClusterRenderer için alt sınıflandırma yaparak varsayılan değerleri geçersiz kılabilirsiniz.

Kapsamlı bir özelleştirme örneği için yardımcı program kitaplığı ile birlikte gönderilen demo uygulamasında CustomMarkerClusteringDemoActivity öğesini inceleyin.

Özel kümelenmiş işaretçilere sahip bir harita
Özel kümelenmiş işaretçiler

CustomMarkerClusteringDemoActivity, kendi küme öğesini (Person) tanımlar ve DefaultClusterRenderer öğesini PersonRenderer olarak genişleterek oluşturur.

Ayrıca demo, küme tıklandığında kullanıcı hakkında daha fazla bilgi görüntülemek için ClusterManager.OnClusterClickListener<Person> arayüzünün nasıl uygulanacağını gösterir. Benzer bir şekilde ClusterManager.OnClusterItemClickListener<Person> de uygulayabilirsiniz.

Demo uygulamasının çalıştırılmasıyla ilgili yardım için kurulum kılavuzuna bakın.