Menampilkan informasi fitur di SDK iOS (Pratinjau)
Catatan
Penghentian Azure Peta iOS SDK
Azure Peta Native SDK untuk iOS sekarang tidak digunakan lagi dan akan dihentikan pada 31/3/3/25. Untuk menghindari gangguan layanan, migrasikan ke Azure Peta Web SDK dengan 3/31/25. Untuk informasi selengkapnya, lihat Panduan migrasi Azure Peta iOS 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 "Hello World!".
// Create a data source and add it to the map.
let source = DataSource()
map.sources.add(source)
// Create a point feature.
let feature = Feature(Point(CLLocationCoordinate2D(latitude: -122.33, longitude: 47.64)))
// Add a property to the feature.
feature.addProperty("title", value: "Hello World!")
// Create a point feature, pass in the metadata properties, and add it to the data source.
source.add(feature: 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 azureMap(_:didTapOn:) ini adalah aktivitas utama yang digunakan untuk mendeteksi ketika pengguna mengetuk fitur di peta. Ada juga sebuah aktivitas azureMap(_:didLongPressOn:). Ketika delegasi ditambahkan ke peta, itu 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 di peta, lalu menambahkan delegasi, terbatas pada lapisan simbol ini, yang menangani azureMap(_:didTapOn:) peristiwa.
// Create a symbol and add it to the map.
let layer = SymbolLayer(source: source)
map.layers.addLayer(layer)
// Add the delegate to the map to handle feature tap events on the layer only.
map.events.addDelegate(self, for: [layer.id])
func azureMap(_ map: AzureMap, didTapOn features: [Feature]) {
// Retrieve the title property of the feature as a string.
let title = features.first?.properties["title"] as? String
// Do something with the title.
}
Menampilkan peringatan
Peringatan adalah salah satu cara termudah untuk menampilkan informasi kepada pengguna dan tersedia di semua versi iOS yang biasanya didukung. Jika Anda ingin memberi tahu pengguna sesuatu tentang apa yang mereka ketuk dengan cepat, peringatan mungkin merupakan pilihan yang baik. Kode berikut menunjukkan bagaimana peringatan dapat digunakan dengan peristiwaazureMap(_:didTapOn:).
func azureMap(_ map: AzureMap, didTapOn features: [Feature]) {
// Retrieve the title property of the feature as a string.
let title = features.first?.properties["title"] as? String
// Display an alert with the title information.
let alert = UIAlertController(title: title, message: nil, preferredStyle: .alert)
alert.addAction(UIAlertAction(title: "OK", style: .cancel))
present(alert, animated: true)
}
Selain peringatan, ada banyak cara lain untuk menampilkan properti metadata dari suatu fitur, seperti:
- Menambahkan tampilan kustom di atas peta
- Menambahkan pengontrol tampilan turunan di atas peta
- Hadirkan pengontrol tampilan lain secara modern di atas yang sekarang.
- Navigasikan ke pengontrol tampilan.
Menampilkan popup
SDK iOS Azure Maps menyediakan kelas Popup yang memudahkan pembuatan elemen anotasi antarmuka pengguna yang berlabuh ke posisi pada peta. Untuk munculan, Anda harus meneruskan tampilan ukuran sendiri ke dalam opsi munculan content. Berikut adalah contoh tampilan sederhana yang menampilkan teks gelap di atas latar belakang putih.
class PopupTextView: UIView {
private let textLabel: UILabel = {
let label = UILabel()
label.translatesAutoresizingMaskIntoConstraints = false
label.numberOfLines = 0
label.textColor = UIColor(red: 34 / 255, green: 34 / 255, blue: 34 / 255, alpha: 1)
label.font = .systemFont(ofSize: 18)
return label
}()
override init(frame: CGRect) {
super.init(frame: frame)
setup()
}
required init?(coder: NSCoder) {
super.init(coder: coder)
}
override func awakeFromNib() {
super.awakeFromNib()
setup()
}
private func setup() {
backgroundColor = .white
addSubview(textLabel)
NSLayoutConstraint.activate([
textLabel.topAnchor.constraint(equalTo: topAnchor, constant: 10),
textLabel.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -10),
textLabel.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 10),
textLabel.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -25)
])
}
func setText(_ text: String) {
textLabel.text = text
}
}
Kode berikut membuat munculan, menambahkannya ke peta. Saat fitur diketuk, properti title ditampilkan menggunakan tata letak kelas PopupTextView, dengan bagian tengah bawah tata letak berlabuh ke posisi yang ditentukan pada peta.
// Create a popup and add it to the map.
let popup = Popup()
map.popups.add(popup)
// Set popup to the class property to use in events handling later.
self.popup = popup
func azureMap(_ map: AzureMap, didTapOn features: [Feature]) {
guard let popup = popup, let feature = features.first else {
// Popup has been released or no features provided
return
}
// Create the custom view for the popup.
let customView = PopupTextView()
// Set the text to the custom view.
let text = feature.properties["title"] as! String
customView.setText(text)
// Get the position of the tapped feature.
let position = Math.positions(from: feature).first!
// Set the options on the popup.
popup.setOptions([
// Set the popups position.
.position(position),
// Set the anchor point of the popup content.
.anchor(.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 points.
// .pointOffset(CGPoint(x: 10, y: 10))
])
// Open the popup.
popup.open()
}
Tangkapan layar berikut menunjukkan popup yang muncul saat fitur diketuk dan tetap berlabuh ke lokasi yang ditentukan di peta saat fitur tersebut bergerak.
Informasi Tambahan
Untuk menambahkan lebih banyak data ke peta Anda: