Menampilkan informasi fitur

Catatan

Penghentian Azure Peta Android SDK

Azure Peta Native SDK untuk Android sekarang tidak digunakan lagi dan akan dihentikan pada 31/3/25. Untuk menghindari gangguan layanan, migrasikan ke Azure Peta Web SDK dengan 3/31/25. Untuk informasi selengkapnya, lihat Panduan migrasi Azure Peta Android SDK.

Data spasial sering diwakili menggunakan titik, garis, dan poligon. Data ini sering memiliki informasi metadata yang berkaitan. Misalnya, suatu titik dapat mewakili lokasi restoran, dan metadata tentang restoran tersebut dapat berupa nama, alamat, dan jenis makanan yang disajikan. Metadata ini dapat ditambahkan sebagai properti Feature GeoJSON. Kode berikut membuat fitur titik sederhana dengan properti title yang memiliki nilai "Halo Dunia!"

//Create a data source and add it to the map.
DataSource source = new DataSource();
map.sources.add(source);

//Create a point feature.
Feature feature = Feature.fromGeometry(Point.fromLngLat(-122.33, 47.64));

//Add a property to the feature.
feature.addStringProperty("title", "Hello World!");

//Create a point feature, pass in the metadata properties, and add it to the data source.
source.add(feature);

//Create a data source and add it to the map.
val source = DataSource()
map.sources.add(source)

//Create a point feature.
val feature = Feature.fromGeometry(Point.fromLngLat(-122.33, 47.64))

//Add a property to the feature.
feature.addStringProperty("title", "Hello World!")

//Create a point feature, pass in the metadata properties, and add it to the data source.
source.add(feature)

Untuk informasi selengkapnya tentang cara membuat dan menambahkan data ke peta, lihat Membuat sumber data.

Saat pengguna berinteraksi dengan fitur di peta, aktivitas dapat digunakan untuk bereaksi terhadap tindakan tersebut. Skenario umumnya adalah menampilkan pesan yang terbuat dari properti metadata dari fitur yang berinteraksi dengan pengguna. Aktivitas OnFeatureClick ini adalah aktivitas utama yang digunakan untuk mendeteksi ketika pengguna mengetuk fitur di peta. Ada juga sebuah aktivitas OnLongFeatureClick. OnFeatureClick Ketika peristiwa ditambahkan ke peta, peristiwa dapat dibatasi pada satu lapisan dengan meneruskan ID lapisan untuk membatasinya. Jika tidak ada ID lapisan yang diteruskan, mengetuk fitur apa pun di peta akan mengaktifkan aktivitas ini, terlepas dari lapisan mana aktivitas berada. Kode berikut membuat lapisan simbol untuk merender data titik pada peta, lalu menambahkan aktivitas OnFeatureClick dan membatasinya ke lapisan simbol ini.

//Create a symbol and add it to the map.
SymbolLayer layer = new SymbolLayer(source);
map.layers.add(layer);

//Add a feature click event to the map.
map.events.add((OnFeatureClick) (features) -> {
    //Retrieve the title property of the feature as a string.
    String msg = features.get(0).getStringProperty("title");

    //Do something with the message.

    //Return a boolean indicating if event should be consumed or continue bubble up.
    return false;
}, layer.getId());    //Limit this event to the symbol layer.

//Create a symbol and add it to the map.
val layer = SymbolLayer(source)
map.layers.add(layer)

//Add a feature click event to the map.
map.events.add(OnFeatureClick { features: List<Feature> ->
    //Retrieve the title property of the feature as a string.
    val msg = features[0].getStringProperty("title")

    //Do something with the message.

    //Return a boolean indicating if event should be consumed or continue bubble up.
    return false
}, layer.getId()) //Limit this event to the symbol layer.

Menampilkan pesan toast

Pesan toast adalah salah satu cara termudah untuk menampilkan informasi kepada pengguna. Terlebih, ini juga tersedia di semua versi Android. Pesan toast tidak mendukung semua jenis input pengguna dan hanya ditampilkan untuk waktu yang singkat. Jika Anda ingin dengan cepat memberi tahu pengguna tentang apa yang telah mereka ketuk, pesan toast mungkin merupakan pilihan yang tepat. Kode berikut menunjukkan bagaimana pesan toast dapat digunakan dengan aktivitas OnFeatureClick.

//Add a feature click event to the map.
map.events.add((OnFeatureClick) (features) -> {
    //Retrieve the title property of the feature as a string.
    String msg = features.get(0).getStringProperty("title");

    //Display a toast message with the title information.
    Toast.makeText(this, msg, Toast.LENGTH_SHORT).show();

    //Return a boolean indicating if event should be consumed or continue bubble up.
    return false;
}, layer.getId());    //Limit this event to the symbol layer.

//Add a feature click event to the map.
map.events.add(OnFeatureClick { features: List<Feature> ->
    //Retrieve the title property of the feature as a string.
    val msg = features[0].getStringProperty("title")

    //Display a toast message with the title information.
    Toast.makeText(this, msg, Toast.LENGTH_SHORT).show()

    //Return a boolean indicating if event should be consumed or continue bubble up.
    return false
}, layer.getId()) //Limit this event to the symbol layer.

Selain pesan toast, ada banyak cara lain untuk menyajikan properti metadata dari sebuah fitur, seperti:

• Widget Snackbar - Snackbars memberikan umpan balik ringan tentang operasi. Widget Snackbar menunjukkan pesan singkat di bagian bawah layar pada ponsel dan kiri bawah pada perangkat yang lebih besar. Snackbars muncul di atas semua elemen lain di layar dan hanya satu yang dapat ditampilkan pada satu waktu.
• Dialog - Dialog adalah jendela kecil yang meminta pengguna membuat keputusan atau memasukkan informasi tambahan. Dialog tidak memenuhi layar dan biasanya digunakan untuk aktivitas modal yang mengharuskan pengguna untuk mengambil tindakan sebelum mereka dapat melanjutkan.
• Menambahkan Fragmen ke aktivitas saat ini.
• Navigasikan ke aktivitas atau tampilan lain.

Menampilkan popup

Azure Maps Android SDK menyediakan kelas Popup yang memudahkan pembuatan elemen anotasi UI yang berlabuh ke posisi pada peta. Untuk popup, Anda harus meneruskan tampilan dengan tata letak relatif ke dalam opsi content popup. Berikut adalah contoh tata letak sederhana yang menampilkan teks gelap di atas latar belakang sementara.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:background="#ffffff"
    android:layout_margin="8dp"
    android:padding="10dp"

    android:layout_height="match_parent">

    <TextView
        android:id="@+id/message"
        android:layout_width="wrap_content"
        android:text=""
        android:textSize="18dp"
        android:textColor="#222"
        android:layout_height="wrap_content"
        android:width="200dp"/>

</RelativeLayout>

Dengan asumsi tata letak di atas disimpan dalam file yang disebut popup_text.xml di folder res -> layout aplikasi, kode berikut membuat popup, lalu menambahkannya ke peta. Saat fitur diklik, properti title ditampilkan menggunakan tata letak popup_text.xml, dengan bagian tengah bawah tata letak berlabuh ke posisi yang ditentukan pada peta.

//Create a popup and add it to the map.
Popup popup = new Popup();
map.popups.add(popup);

map.events.add((OnFeatureClick)(feature) -> {
    //Get the first feature and it's properties.
    Feature f = feature.get(0);
    JsonObject props = f.properties();

    //Retrieve the custom layout for the popup.
    View customView = LayoutInflater.from(this).inflate(R.layout.popup_text, null);

    //Access the text view within the custom view and set the text to the title property of the feature.
    TextView tv = customView.findViewById(R.id.message);
    tv.setText(props.get("title").getAsString());

    //Get the position of the clicked feature.
    Position pos = MapMath.getPosition((Point)cluster.geometry());

    //Set the options on the popup.
    popup.setOptions(
        //Set the popups position.
        position(pos),

        //Set the anchor point of the popup content.
        anchor(AnchorType.BOTTOM),

        //Set the content of the popup.
        content(customView)

        //Optionally, hide the close button of the popup.
        //, closeButton(false)

        //Optionally offset the popup by a specified number of pixels.
        //pixelOffset(new Pixel(10, 10))
    );

    //Open the popup.
    popup.open();

    //Return a boolean indicating if event should be consumed or continue bubble up.
    return false;
});

//Create a popup and add it to the map.
val popup = Popup()
map.popups.add(popup)

map.events.add(OnFeatureClick { feature: List<Feature> ->
    //Get the first feature and it's properties.
    val f = feature[0]
    val props = f.properties()

    //Retrieve the custom layout for the popup.
    val customView: View = LayoutInflater.from(this).inflate(R.layout.popup_text, null)

    //Access the text view within the custom view and set the text to the title property of the feature.
    val tv: TextView = customView.findViewById(R.id.message)
    tv.text = props!!["title"].asString

    //Get the position of the clicked feature.
    val pos = MapMath.getPosition(f.geometry() as Point?);

    //Set the options on the popup.
    popup.setOptions( 
        //Set the popups position.
        position(pos),  

        //Set the anchor point of the popup content.
        anchor(AnchorType.BOTTOM),  

        //Set the content of the popup.
        content(customView) 

        //Optionally, hide the close button of the popup.
        //, closeButton(false)

        //Optionally offset the popup by a specified number of pixels.
        //pixelOffset(Pixel(10, 10))
    )

    //Open the popup.
    popup.open()

    //Return a boolean indicating if event should be consumed or continue bubble up.
    false
})

Tangkapan layar berikut menunjukkan popup muncul saat fitur diklik dan tetap jangkar ke lokasi yang ditentukan di peta saat bergerak.

Langkah berikutnya

Untuk menambahkan lebih banyak data ke peta Anda:

Bereaksi terhadap aktivitas peta

Membuat sumber data

Menambah lapisan simbol

Menambahkan lapisan gelembung

Menambah lapisan baris

Menambah lapisan poligon