Dalam dokumen ini, Anda akan mempelajari cara menggunakan Nearby Search (New) API untuk mem-build aplikasi yang sederhana dan hemat biaya
pengalaman penemuan lokal.
Pengalaman penemuan lokal menampilkan tempat-tempat menarik utama kepada pengguna di dekat lokasi yang Anda tentukan saat menelusuri hotel atau properti. Sering kali terdiri dari peta interaktif, dengan panel tambahan yang berisi pemilih tempat dan galeri foto. Anda akan melihat berbagai produk dan kemampuan Google Maps Platform untuk meningkatkan pengalaman dengan interaktivitas.
Kasus Penggunaan
Sekarang, mari kita pahami elemen integrasi penemuan lokal yang mendorong nilai pengguna:
Penemuan - Memberikan ringkasan kepada pengguna tentang apa yang ada di sekitar satu lokasi dengan menampilkan berbagai jenis tempat yang relevan.
Interaktivitas - Memungkinkan pengguna memilih tempat dan memuat ulang data secara dinamis
relatif terhadap tempat itu.
Visualisasi - Memberikan ulasan, foto tempat
serta waktu dan jarak berjalan kaki agar pengguna dapat memahami dengan cepat apakah aplikasi tersebut sesuai dengan kebutuhan mereka atau tidak.
Arsitektur Referensi
Penemuan Lokal
Ada banyak cara untuk membuat pengalaman penemuan lokal. Integrasi berikut adalah contoh kustom pengalaman pengguna yang memanfaatkan API Google Maps Platform yang terkenal serta beberapa fitur baru yang menarik. Jika ingin memiliki pendekatan template untuk penemuan lokal, Anda dapat menggunakan Komponen Web.
Contoh Aplikasi
Panduan Contoh
Anda akan menemukan contoh aplikasi yang dibagi menjadi beberapa langkah di tabel di bawah ini, bersama dengan deskripsi implementasi teknis dengan Google Maps Platform API.
1. Penelusuran Lokasi dengan lokasi AutocompleteSearch
- Muat Maps JavaScript API.
- Kueri Places Autocomplete atau pilih lokasi di peta.
2. Menampilkan lokasi menarik lokal menggunakan Nearby Search API (Baru)
- Peringkat popularitas (hasil yang lebih relevan) atau Peringkat jarak.
includedTypes
,excludedTypes
; jika Anda adalah hotel, Anda dapat mengecualikan jenis "lodging", dan hanya menyertakan jenis yang sesuai, yaitu: "restaurant, cafe, park, tourit_attraction".- Manfaatkan
includedPrimaryTypes
,excludedPrimaryTypes
untuk kontrol yang lebih besar atas hasil. - `locationRestriction untuk menghindari jumlah hasil yang tidak memadai atau tempat yang terlalu jauh; jika hasil NOL, luaskan ukuran lingkaran / persegi panjang sebelum menampilkan hasil.
Contoh kueri saat memesan hotel dengan kolom Data yang diminta:
- Dasar (
displayName
,types
,openingHours
,formattedAddress
) - Kontak (
websiteUri
,nationalPhoneNumber
,internationalPhoneNumber
) - Lebih disukai (
reviews
,priceLevel
,userRatingCount
)
{ "includedTypes": ["restaurant","cafe","park"], "excludedTypes": ["lodging","convenience_store"], "includedPrimaryTypes": ["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes": ["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": { "center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }
Contoh kueri saat menelusuri properti dengan kolom Data yang diminta:
- Dasar (
displayName
,types
,openingHours
,formattedAddress
)
{ "includedTypes": ["school","transport","bus","convenience_store"], "excludedTypes": ["lodging"], "includedPrimaryTypes": ["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes": ["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": { "center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }
3. Menambahkan interaktif dengan Dynamic Maps and Directions API
- Bagian dan langkah terbaru dengan membuat kueri Directions API. * Gunakan waktu di bagian berikutnya.
4. Menampilkan informasi mendetail tentang tempat saat berinteraksi
Deskripsi:
displayName
,types
,rating
,userRatingCount
,priceLevel
.Waktu: berasal dari kueri Directions API sebelumnya.
Ulasan:
reviews[i].author
,reviews[i].rating
,reviews[i].text
.Gambar: selama Pratinjau Tidak Dibatasi untuk Nearby Search (New) API, Anda harus membuat kueri Places Details dengan
place.id
untuk mendapatkan photo_reference lalu membuat kueri satu per satu dalam pengalaman Anda
Jumlah kueri dan biaya yang terkait
- Maps JavaScript API: 1 peta saat memuat pengalaman.
- Places Autocomplete API: 1 kueri untuk setiap karakter yang diketik (jika menggunakan Widget Autocomplete), yang dapat disesuaikan.
- Nearby Search (New) API: 1 kueri setiap 20 tempat yang ditampilkan. Penagihan yang berbeda sesuai dengan data Tempat yang merupakan bagian dari respons kueri.
- Directions API: 1 kueri setiap tempat yang dipilih oleh pengguna.
- Place Photo API: 1 kueri untuk setiap foto yang ditampilkan.
Kesimpulan
Pengalaman penemuan lokal adalah cara yang efektif untuk memberikan nilai kepada pengguna. Penerapan demonstrasi ini memiliki banyak fitur yang kemungkinan akan Anda sertakan saat membuat pengalaman seperti itu di Google Maps Platform dengan kemampuan khusus dari Nearby Search (New) API .
Langkah Berikutnya
Saran bacaan lebih lanjut:
- Komponen Web di Maps JavaScript API
- Pengoptimalan Place Autocomplete
- Layanan Places lainnya
- Berikan masukan di bawah.
Kontributor
Penulis utama:
Thomas Anglaret | Engineer Solusi Google Maps Platform