Utilitas Multi-lapisan Google Maps

Pilih platform: Android JavaScript
  1. Pengantar
  2. Menambahkan beberapa lapisan GeoJSON, KML, dan cluster
  3. Menambahkan fitur Anda sendiri
  4. Menangani peristiwa klik
  5. Melihat aplikasi demo

Pengantar

Dalam tutorial sebelumnya, Anda telah mempelajari cara menambahkan fitur dari KML dan GeoJSON ke peta Anda, serta cluster penanda. Tetapi bagaimana jika Anda ingin menambahkan beberapa lapisan ini pada peta yang sama dan mendapatkan peristiwa klik independen untuk masing-masing lapisan?

Menambahkan beberapa lapisan GeoJSON, KML, dan cluster

Library menyertakan objek Manager untuk membantu mengelola peristiwa klik untuk beberapa jenis lapisan. Jadi, sebelum menyiapkan lapisan, Anda harus membuat instance lapisan ini dan meneruskan GoogleMap terlebih dahulu:

Java


MarkerManager markerManager = new MarkerManager(map);
GroundOverlayManager groundOverlayManager = new GroundOverlayManager(map);
PolygonManager polygonManager = new PolygonManager(map);
PolylineManager polylineManager = new PolylineManager(map);

      

Kotlin


val markerManager = MarkerManager(map)
val groundOverlayManager = GroundOverlayManager(map!!)
val polygonManager = PolygonManager(map)
val polylineManager = PolylineManager(map)

      

Selanjutnya, Anda dapat meneruskan kelas pengelola ini ke dalam konstruktor lapisan lain saat menyiapkannya:

Java


ClusterManager<MyItem> clusterManager = new ClusterManager<>(context, map, markerManager);
GeoJsonLayer geoJsonLineLayer = new GeoJsonLayer(map, R.raw.geojson_file, context, markerManager, polygonManager, polylineManager, groundOverlayManager);
KmlLayer kmlPolylineLayer = new KmlLayer(map, R.raw.kml_file, context, markerManager, polygonManager, polylineManager, groundOverlayManager, null);

      

Kotlin


val clusterManager =
    ClusterManager<MyItem>(context, map, markerManager)
val geoJsonLineLayer = GeoJsonLayer(
    map,
    R.raw.geojson_file,
    context,
    markerManager,
    polygonManager,
    polylineManager,
    groundOverlayManager
)
val kmlPolylineLayer = KmlLayer(
    map,
    R.raw.kml_file,
    context,
    markerManager,
    polygonManager,
    polylineManager,
    groundOverlayManager,
    null
)

      

Menambahkan fitur Anda sendiri

Jika Anda ingin menambahkan penanda, overlay bumi, polyline, atau poligon Anda sendiri bersama lapisan ini, buat Collection Anda sendiri, lalu gunakan Managers untuk menambahkan fitur, bukan menambahkannya secara langsung ke objek GoogleMap. Misalnya, jika Anda ingin menambahkan penanda baru:

Java


MarkerManager.Collection markerCollection = markerManager.newCollection();
markerCollection.addMarker(new MarkerOptions()
    .position(new LatLng(51.150000, -0.150032))
    .icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_AZURE))
    .title("Unclustered marker"));

      

Kotlin


val markerCollection =
    markerManager.newCollection()
markerCollection.addMarker(
    MarkerOptions()
        .position(LatLng(51.150000, -0.150032))
        .icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_AZURE))
        .title("Unclustered marker")
)

      

Menangani peristiwa klik

Untuk cluster, KML, dan GeoJSON, pemroses klik berfungsi seperti biasa - selama Anda meneruskan class Manager dalam konstruktor lapisan yang ditetapkan. Misalnya, berikut cara menyiapkan pemroses klik untuk lapisan KML:

Java


kmlPolylineLayer.addLayerToMap();
kmlPolylineLayer.setOnFeatureClickListener(feature -> Toast.makeText(context,
    "KML polyline clicked: " + feature.getProperty("name"),
    Toast.LENGTH_SHORT).show());

      

Kotlin


kmlPolylineLayer.addLayerToMap()
kmlPolylineLayer.setOnFeatureClickListener { feature: Feature ->
    Toast.makeText(context,
        "KML polyline clicked: ${feature.getProperty("name")}",
        Toast.LENGTH_SHORT
    ).show()
}

      

Saat menambahkan penanda, overlay bumi, polyline, atau poligon Anda sendiri, pastikan untuk menambahkan pemroses klik ke objek Collection tersebut. Misalnya, berikut adalah cara menyiapkan pemroses klik penanda di markerCollection:

Java


markerCollection.setOnMarkerClickListener(marker -> { Toast.makeText(context,
    "Marker clicked: " + marker.getTitle(),
        Toast.LENGTH_SHORT).show();
    return false;
});

      

Kotlin


markerCollection.setOnMarkerClickListener { marker: Marker ->
    Toast.makeText(
        context,
        "Marker clicked: ${marker.title}",
        Toast.LENGTH_SHORT
    ).show()
    false
}

      

Melihat aplikasi demo

Untuk contoh penambahan beberapa lapisan, lihat MultiLayerDemoActivity pada aplikasi demo yang disertakan dengan library utilitas. Panduan penyiapan menunjukkan cara menjalankan aplikasi demo.