ابزار خوشه‌بندی نشانگر Android در Google Maps

پلاتفرم را انتخاب کنید: Android iOS JavaScript

با خوشه‌بندی نشانگرها، می‌توانید تعداد زیادی نشانگر را روی نقشه قرار دهید بدون اینکه خواندن نقشه دشوار شود.

مقدمه

این ویدیو درباره استفاده از خوشه‌بندی نشانگرها در زمانی که داده‌های شما به تعداد زیادی نقطه داده روی نقشه نیاز دارد بحث می‌کند.

ابزار خوشه‌بندی نشانگر به شما کمک می‌کند چندین نشانگر را در سطوح بزرگ‌نمایی مختلف مدیریت کنید. دقیق‌تر بگوییم، «نشانگرها» درواقع در این مرحله «مورد» هستند، و فقط وقتی رندر می‌شوند به «نشانگر» تبدیل می‌شوند. اما برای وضوح بیشتر، این سند در سراسر آن از نام «نشانگرها» استفاده می‌کند.

وقتی کاربر نقشه را در سطح بزرگ‌نمایی بالا مشاهده می‌کند، نشانگرهای تکی در نقشه نشان داده می‌شود. وقتی کاربر زوم‌پَس می‌کند، نشانگرها در خوشه‌ها جمع می‌شوند تا دیدن نقشه آسان‌تر شود. کاروری خوشه‌بندی نشانگرها بخشی از کتابخانه کاروری‌های کیت توسعه نرم‌افزار Maps ویژه Android است. اگر هنوز کتابخانه را راه‌اندازی نکرده‌اید، قبل‌از خواندن بقیه این صفحه، راهنمای راه‌اندازی را دنبال کنید.

نقشه‌ای با نشانگرهای خوشه‌ای
نشانگرهای خوشه‌ای

برای استفاده از ابزار خوشه‌بندی نشانگر، باید نشانگرها را به‌عنوان ClusterItem شیء به ClusterManager اضافه کنید. ClusterManager نشانگرها را به Algorithm منتقل می‌کند، که آن‌ها را به مجموعه‌ای از خوشه‌ها تبدیل می‌کند. ClusterRenderer با افزودن و برداشتن خوشه‌ها و نشانگرهای تکی، رندر کردن را انجام می‌دهد. ‫ClusterRenderer و Algorithm قابل‌اتصال هستند و می‌توان آن‌ها را سفارشی‌سازی کرد.

کتابخانه ابزار کمکی با برنامه نمایشی ارائه می‌شود که نمونه پیاده‌سازی‌های ابزار کمکی خوشه‌بندی نشانگر را ارائه می‌دهد. برای دریافت راهنمایی درباره اجرای برنامه نمایشی، راهنمای راه‌اندازی را ببینید. برنامه نمونه شامل نمونه‌های خوشه‌بندی نشانگر زیر است:

  • ‫ClusteringDemoActivity: فعالیت ساده‌ای که خوشه‌بندی نشانگر را نشان می‌دهد.
  • ‫BigClusteringDemoActivity: خوشه‌بندی با ۲٬۰۰۰ نشانگر.
  • ‫CustomMarkerClusteringDemoActivity: ایجاد طراحی سفارشی برای نشانگرهای خوشه‌ای.

افزودن خوشه‌بندی نشانگر ساده

برای ایجاد خوشه‌ای ساده از ده نشانگر، مراحل زیر را دنبال کنید. نتیجه به این شکل خواهد بود، هرچند تعداد نشانگرهای نمایش‌داده‌شده/خوشه‌بندی‌شده بسته به سطح بزرگ‌نمایی تغییر خواهد کرد:

نقشه‌ای با ده نشانگر خوشه‌ای
ده نشانگر خوشه‌ای

خلاصه‌ای از مراحل لازم در اینجا آمده است:

  1. برای نمایش نشانگر روی نقشه، ClusterItem را پیاده‌سازی کنید. مورد خوشه موقعیت نشانگر را به‌عنوان شیء LatLng و عنوان یا قطعه اختیاری برمی‌گرداند.
  2. ClusterManager جدیدی اضافه کنید تا موارد خوشه (نشانگرها) را براساس سطح بزرگ‌نمایی گروه‌بندی کند.
  3. OnCameraIdleListener() نقشه را روی ClusterManager تنظیم کنید، زیرا ClusterManager شنونده را پیاده‌سازی می‌کند.
  4. اگر می‌خواهید عملکرد خاصی را در پاسخ به رویداد کلیک روی نشانه اضافه کنید، OnMarkerClickListener() نقشه را روی ClusterManager تنظیم کنید، زیرا ClusterManager شنونده را پیاده‌سازی می‌کند.
  5. نشانگرها را به ClusterManager وارد کنید.

نگاهی به مراحل با جزئیات بیشتر: برای ایجاد خوشه ساده ما از ده نشانگر، ابتدا یک کلاس MyItem ایجاد کنید که ClusterItem را پیاده‌سازی می‌کند.

Kotlin

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

    override val position: LatLng = LatLng(lat, lng)

    override val zIndex: Float = 0f

    override fun equals(other: Any?): Boolean {
        if (this === other) return true
        if (other !is MyItem) return false
        return position == other.position && title == other.title
    }

    override fun hashCode(): Int {
        var result = position.hashCode()
        result = 31 * result + title.hashCode()
        return result
    }
}

      

جاوا

public static 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;
    }
}

      

در فعالیت نقشه، ClusterManager را اضافه کنید و موارد خوشه را به آن بدهید. به نوع متغیر مستقل <MyItem> توجه کنید که ClusterManager را از نوع MyItem اعلام می‌کند.

Kotlin

// 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.)
val manager = ClusterManager<MyItem>(context, map)
clusterManager = manager

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

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

      

جاوا

// 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();
clusterManager.cluster();

      

همچنین می‌توانید پویانمایی‌های خوشه‌بندی را هنگام زوم‌پیش و زوم‌پس کردن غیرفعال کنید. اگر پویانمایی خاموش باشد، نشانگرها به‌جای اینکه به داخل و خارج خوشه‌ها منتقل شوند، در موقعیت خود ثابت می‌شوند. برای غیرفعال کردن پویانمایی‌ها، از setAnimation() در ClusterManager استفاده کنید، همان‌طور که در زیر نشان داده شده است:

Kotlin

it.setAnimation(false)

      

جاوا

clusterManager.setAnimation(false);

      

افزودن پنجره اطلاعات برای نشانگر خوشه‌ای تکی

برای افزودن پنجره اطلاعات برای نشانگرهای خوشه‌ای خاص، رشته‌های عنوان و گزیده را به سازنده پیاده‌سازی ClusterItem اضافه کنید.

مثال زیر با تنظیم عنوان و گزیده، نشانگری با پنجره اطلاعات در روش addItems() اضافه می‌کند:

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.
it.addItem(infoWindowItem)
it.cluster()

      

جاوا

// 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);

      

سفارشی‌سازی خوشه‌های نشانگر

سازنده ClusterManager یک DefaultClusterRenderer و یک NonHierarchicalDistanceBasedAlgorithm ایجاد می‌کند. می‌توانید ClusterRenderer و Algorithm را بااستفاده از روش‌های setAlgorithm(Algorithm<T> algorithm) و setRenderer(ClusterRenderer<T> view) ClusterManager تغییر دهید.

می‌توانید ClusterRenderer را برای سفارشی‌سازی کردن پرداز خوشه‌ها پیاده‌سازی کنید. DefaultClusterRenderer پایه خوبی برای شروع ارائه می‌دهد. با زیرکلاس‌بندی DefaultClusterRenderer، می‌توانید پیش‌فرض‌ها را لغو کنید.

برای مشاهده نمونه‌ای دقیق از سفارشی‌سازی، به CustomMarkerClusteringDemoActivity در برنامه نمایشی که همراه با کتابخانه ابزار ارائه می‌شود نگاهی بیندازید.

نقشه‌ای با نشانگرهای خوشه‌ای سفارشی
نشانگرهای خوشه‌ای سفارشی

‫CustomMarkerClusteringDemoActivity مورد خوشه خود، Person، را تعریف می‌کند و آن را با گسترش دادن DefaultClusterRenderer به‌عنوان PersonRenderer پرداز می‌کند.

این نسخه نمایشی همچنین نحوه پیاده‌سازی میانای ClusterManager.OnClusterClickListener<Person> را برای نمایش اطلاعات بیشتر درباره فرد هنگام کلیک کردن روی خوشه نشان می‌دهد. همچنین می‌توانید ClusterManager.OnClusterItemClickListener<Person> را به روش مشابهی پیاده‌سازی کنید.

برای دریافت راهنمایی درباره اجرای برنامه نمایشی، راهنمای راه‌اندازی را ببینید.