Places Widgets

Class PlaceAutocompleteElement

Class google.maps.places.PlaceAutocompleteElement

PlaceAutocompleteElement adalah subclass HTMLElement yang menyediakan komponen UI untuk Places Autocomplete API.

Elemen kustom:
<gmp-place-autocomplete name="string" requested-language="string" requested-region="string" types="type1 type2 type3..."></gmp-place-autocomplete>

Class ini memperluas HTMLElement.

Class ini mengimplementasikan PlaceAutocompleteElementOptions.

Akses dengan memanggil const {PlaceAutocompleteElement} = await google.maps.importLibrary("places"). Lihat Library di Maps JavaScript API.
PlaceAutocompleteElement
PlaceAutocompleteElement(options)
Parameter: 
componentRestrictions
Jenis:  ComponentRestrictions optional
Pembatasan komponen. Pembatasan komponen digunakan untuk membatasi prediksi hanya pada prediksi dalam komponen induk. Misalnya, negara.
locationBias
Jenis:  LocationBias optional
Batas atau petunjuk tidak tegas yang akan digunakan saat menelusuri tempat.
locationRestriction
Jenis:  LocationRestriction optional
Batas untuk membatasi hasil penelusuran.
name
Jenis:  string optional
Nama yang akan digunakan untuk elemen input. Lihat https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name untuk mengetahui detailnya. Mengikuti perilaku yang sama dengan atribut nama untuk input. Perhatikan bahwa ini adalah nama yang akan digunakan saat formulir dikirimkan. Lihat https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form untuk mengetahui detailnya.
Atribut HTML:
  • <gmp-placeautocomplete name="string"></gmp-placeautocomplete>
requestedLanguage
Jenis:  string optional
ID bahasa untuk bahasa yang akan digunakan untuk menampilkan hasil, jika memungkinkan. Hasil dalam bahasa yang dipilih mungkin diberi peringkat yang lebih tinggi, tetapi saran tidak terbatas pada bahasa ini. Lihat daftar bahasa yang didukung.
Atribut HTML:
  • <gmp-place-autocomplete requested-language="string"></gmp-place-autocomplete>
requestedRegion
Jenis:  string optional
Kode wilayah yang digunakan untuk pemformatan hasil dan pemfilteran hasil. Tindakan ini tidak membatasi saran untuk negara ini. Kode wilayah menerima nilai dua karakter ccTLD ("domain level teratas"). Umumnya kode ccTLD identik dengan kode ISO 3166-1, dengan beberapa pengecualian. Misalnya, ccTLD Inggris Raya adalah "uk" (.co.uk) sedangkan kode ISO 3166-1-nya adalah "gb" (secara teknis untuk entitas "The United Kingdom of Great Britain and Northern Ireland").
Atribut HTML:
  • <gmp-place-autocomplete requested-region="string"></gmp-place-autocomplete>
types
Jenis:  Array<string> optional
Jenis prediksi yang akan ditampilkan. Untuk jenis yang didukung, lihat panduan developer. Jika tidak ada jenis yang ditentukan, semua jenis akan ditampilkan.
Atribut HTML:
  • <gmp-place-autocomplete types="type1 type2 type3..."></gmp-place-autocomplete>
prediction-item
Item dalam drop-down prediksi yang mewakili satu prediksi.
prediction-item-icon
Ikon yang ditampilkan di sebelah kiri setiap item dalam daftar prediksi.
prediction-item-main-text
Bagian dari item prediksi yang merupakan teks utama prediksi. Untuk lokasi geografis, isinya adalah nama tempat, seperti 'Sydney', atau nama jalan dan nomor rumah, seperti '10 King Street'. Secara default, prediction-item-main-text berwarna hitam. Jika ada teks tambahan dalam prediction-item, teks tersebut berada di luar prediction-item-main-text dan mewarisi gayanya dari prediction-item. Secara default, warnanya abu-abu. Teks tambahan biasanya berupa alamat.
prediction-item-match
Bagian dari prediksi yang dikembalikan sesuai dengan masukan pengguna. Secara default, teks yang cocok ini disorot dalam teks tebal. Perhatikan bahwa teks yang cocok dapat berada di mana saja dalam prediction-item. Ini tidak harus merupakan bagian dari prediction-item-main-text.
prediction-item-selected
Item saat pengguna membukanya melalui keyboard. Catatan: Item yang dipilih akan terpengaruh oleh gaya bagian ini dan juga gaya bagian item prediksi.
prediction-list
Elemen visual berisi daftar prediksi yang dikembalikan oleh layanan Place Autocomplete. Daftar ini muncul sebagai daftar dropdown di bawah PlaceAutocompleteElement.
BetaaddEventListener
addEventListener(type, listener[, options])
Parameter: 
  • type:  string String peka huruf besar/kecil yang mewakili jenis peristiwa yang akan diproses.
  • listener:  EventListener|EventListenerObject Objek yang menerima notifikasi. Ini harus berupa fungsi atau objek dengan metode handleEvent
  • options:  boolean|AddEventListenerOptions optional Lihat opsi. Peristiwa kustom hanya mendukung capture dan passive.
Nilai Hasil:  void
Menyiapkan fungsi yang akan dipanggil setiap kali peristiwa yang ditentukan dikirim ke target. Lihat addEventListener
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parameter: 
  • type:  string String yang menentukan jenis peristiwa yang akan menghapus pemroses peristiwa.
  • listener:  EventListener|EventListenerObject Pemroses peristiwa pengendali peristiwa yang akan dihapus dari target peristiwa.
  • options:  boolean|EventListenerOptions optional Lihat opsi
Nilai Hasil:  void
Menghapus pemroses peristiwa yang sebelumnya terdaftar dengan addEventListener dari target. Lihat removeEventListener
gmp-placeselect
function(placeAutocompletePlaceSelectEvent)
Argumen: 
Peristiwa ini diaktifkan saat pengguna memilih prediksi tempat. Berisi objek Place.
gmp-requesterror
function(placeAutocompleteRequestErrorEvent)
Argumen: 
Peristiwa ini diaktifkan saat permintaan ke backend ditolak (misalnya, kunci API salah). Peristiwa ini tidak menggelembungkan.

Antarmuka PlaceAutocompleteElementOptions

Antarmuka google.maps.places.PlaceAutocompleteElementOptions

Opsi untuk membuat PlaceAutocompleteElement.
componentRestrictions optional
Jenis:  ComponentRestrictions optional
Lihat PlaceAutocompleteElement.componentRestrictions
locationBias optional
Jenis:  LocationBias optional
Lihat PlaceAutocompleteElement.locationBias
locationRestriction optional
Jenis:  LocationRestriction optional
Lihat PlaceAutocompleteElement.locationRestriction
requestedLanguage optional
Jenis:  string optional
Lihat PlaceAutocompleteElement.requestedLanguage
requestedRegion optional
Jenis:  string optional
Lihat PlaceAutocompleteElement.requestedRegion
types optional
Jenis:  Array<string> optional
Lihat PlaceAutocompleteElement.types

Class PlaceAutocompletePlaceSelectEvent

Class google.maps.places.PlaceAutocompletePlaceSelectEvent

Peristiwa ini dibuat setelah pengguna memilih tempat dengan Elemen Place Autocomplete. Akses pilihan dengan event.place.

Class ini memperluas Event.

Akses dengan memanggil const {PlaceAutocompletePlaceSelectEvent} = await google.maps.importLibrary("places"). Lihat Library di Maps JavaScript API.
Betaplace
Jenis:  Place

Class PlaceAutocompleteRequestErrorEvent

Class google.maps.places.PlaceAutocompleteRequestErrorEvent

Peristiwa ini dikeluarkan oleh PlaceAutocompleteElement saat ada masalah dengan permintaan jaringan.

Class ini memperluas Event.

Akses dengan memanggil const {PlaceAutocompleteRequestErrorEvent} = await google.maps.importLibrary("places"). Lihat Library di Maps JavaScript API.

Class PlaceDetailsElement

Class google.maps.places.PlaceDetailsElement

Elemen HTML yang menampilkan detail untuk suatu tempat. Gunakan metode configureFromPlace() atau configureFromLocation() untuk menentukan konten yang akan dirender. Untuk menggunakan Elemen Place Details, aktifkan Places UI Kit API untuk project Anda di konsol Google Cloud.

Elemen kustom:
<gmp-place-details size="small"></gmp-place-details>

Class ini memperluas HTMLElement.

Class ini mengimplementasikan PlaceDetailsElementOptions.

Akses dengan memanggil const {PlaceDetailsElement} = await google.maps.importLibrary("places"). Lihat Library di Maps JavaScript API.
PlaceDetailsElement
PlaceDetailsElement([options])
Parameter: 
place
Jenis:  Place optional
Hanya baca. Objek Place yang berisi ID, lokasi, dan area pandang tempat yang saat ini dirender.
size
Jenis:  PlaceDetailsSize optional
Varian ukuran PlaceDetailsElement. Secara default, elemen akan menampilkan PlaceDetailsSize.X_LARGE.
Atribut HTML:
  • <gmp-place-details size="small"></gmp-place-details>
  • <gmp-place-details size="medium"></gmp-place-details>
  • <gmp-place-details size="large"></gmp-place-details>
  • <gmp-place-details size="x-large"></gmp-place-details>
BetaaddEventListener
addEventListener(type, listener[, options])
Parameter: 
  • type:  string String peka huruf besar/kecil yang mewakili jenis peristiwa yang akan diproses.
  • listener:  EventListener|EventListenerObject Objek yang menerima notifikasi. Ini harus berupa fungsi atau objek dengan metode handleEvent
  • options:  boolean|AddEventListenerOptions optional Lihat opsi. Peristiwa kustom hanya mendukung capture dan passive.
Nilai Hasil:  void
Menyiapkan fungsi yang akan dipanggil setiap kali peristiwa yang ditentukan dikirim ke target. Lihat addEventListener
configureFromLocation
configureFromLocation(location)
Parameter: 
Nilai Pengembalian:  Promise<void> Promise yang diselesaikan setelah data tempat dimuat dan dirender.
Mengonfigurasi widget dari LatLng menggunakan geocoding terbalik.
configureFromPlace
configureFromPlace(place)
Parameter: 
  • place:  Place|{id:string} Tempat untuk merender detail.
Nilai Pengembalian:  Promise<void> Promise yang diselesaikan setelah data tempat dimuat dan dirender.
Mengonfigurasi widget dari objek Place atau ID Tempat.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parameter: 
  • type:  string String yang menentukan jenis peristiwa yang akan menghapus pemroses peristiwa.
  • listener:  EventListener|EventListenerObject Pemroses peristiwa pengendali peristiwa yang akan dihapus dari target peristiwa.
  • options:  boolean|EventListenerOptions optional Lihat opsi
Nilai Hasil:  void
Menghapus pemroses peristiwa yang sebelumnya terdaftar dengan addEventListener dari target. Lihat removeEventListener
gmp-load
function(event)
Argumen: 
Peristiwa ini diaktifkan saat elemen memuat dan merender kontennya. Peristiwa ini tidak menggelembungkan.
gmp-requesterror
function(event)
Argumen: 
Peristiwa ini diaktifkan saat permintaan ke backend ditolak (misalnya, kunci API salah). Peristiwa ini tidak menggelembungkan.

Antarmuka PlaceDetailsElementOptions

Antarmuka google.maps.places.PlaceDetailsElementOptions

Opsi untuk PlaceDetailsElement.
size optional
Jenis:  PlaceDetailsSize optional
Lihat PlaceDetailsElement.size

Konstanta PlaceDetailsSize

Konstanta google.maps.places.PlaceDetailsSize

Varian ukuran untuk PlaceDetailsElement.

Akses dengan memanggil const {PlaceDetailsSize} = await google.maps.importLibrary("places"). Lihat Library di Maps JavaScript API.
LARGE Varian besar termasuk gambar besar, informasi dasar, dan informasi kontak.
MEDIUM Varian sedang yang menyertakan gambar besar dan informasi dasar.
SMALL Varian kecil yang menyertakan gambar kecil dan informasi dasar.
X_LARGE Varian ekstra besar yang mencakup kolase foto, ulasan, dan informasi tempat yang komprehensif.

Class PlaceListElement

Class google.maps.places.PlaceListElement

Elemen HTML yang menampilkan hasil penelusuran tempat dalam daftar. Gunakan metode configureFromSearchByTextRequest() atau configureFromSearchNearbyRequest() untuk menentukan permintaan yang akan merender hasil. Untuk menggunakan Elemen Daftar Tempat, aktifkan Places UI Kit API untuk project Anda di Konsol Google Cloud.

Elemen kustom:
<gmp-place-list selectable></gmp-place-list>

Class ini memperluas HTMLElement.

Class ini mengimplementasikan PlaceListElementOptions.

Akses dengan memanggil const {PlaceListElement} = await google.maps.importLibrary("places"). Lihat Library di Maps JavaScript API.
PlaceListElement
PlaceListElement([options])
Parameter: 
places
Jenis:  Array<Place>
Hanya baca. Array objek Place yang berisi ID, lokasi, dan area pandang tempat yang saat ini dirender.
selectable
Jenis:  boolean
Apakah item daftar dapat dipilih atau tidak. Jika benar, item daftar akan berupa tombol yang mengirim peristiwa gmp-placeselect saat diklik. Navigasi dan pemilihan keyboard yang mudah diakses juga didukung.
Atribut HTML:
  • <gmp-place-list selectable></gmp-place-list>
BetaaddEventListener
addEventListener(type, listener[, options])
Parameter: 
  • type:  string String peka huruf besar/kecil yang mewakili jenis peristiwa yang akan diproses.
  • listener:  EventListener|EventListenerObject Objek yang menerima notifikasi. Ini harus berupa fungsi atau objek dengan metode handleEvent
  • options:  boolean|AddEventListenerOptions optional Lihat opsi. Peristiwa kustom hanya mendukung capture dan passive.
Nilai Hasil:  void
Menyiapkan fungsi yang akan dipanggil setiap kali peristiwa yang ditentukan dikirim ke target. Lihat addEventListener
configureFromSearchByTextRequest
configureFromSearchByTextRequest(request)
Parameter: 
  • request:  SearchByTextRequest Permintaan untuk merender hasil. Properti fields dari SearchByTextRequest tidak diperlukan.
Nilai Pengembalian:  Promise<void> Promise yang diselesaikan setelah data tempat dimuat dan dirender.
Mengonfigurasi widget untuk merender hasil penelusuran dari permintaan Places Text Search API.
configureFromSearchNearbyRequest
configureFromSearchNearbyRequest(request)
Parameter: 
  • request:  SearchNearbyRequest Permintaan untuk merender hasil. Properti fields dari SearchNearbyRequest tidak diperlukan.
Nilai Pengembalian:  Promise<void> Promise yang diselesaikan setelah data tempat dimuat dan dirender.
Mengonfigurasi widget untuk merender hasil penelusuran dari permintaan Places Nearby Search API.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parameter: 
  • type:  string String yang menentukan jenis peristiwa yang akan menghapus pemroses peristiwa.
  • listener:  EventListener|EventListenerObject Pemroses peristiwa pengendali peristiwa yang akan dihapus dari target peristiwa.
  • options:  boolean|EventListenerOptions optional Lihat opsi
Nilai Hasil:  void
Menghapus pemroses peristiwa yang sebelumnya terdaftar dengan addEventListener dari target. Lihat removeEventListener
gmp-load
function(event)
Argumen: 
Peristiwa ini diaktifkan saat elemen memuat dan merender kontennya. Peristiwa ini tidak menggelembungkan.
gmp-placeselect
function(event)
Argumen: 
Peristiwa ini diaktifkan saat pengguna memilih tempat. Berisi objek Place dan indeks tempat yang dipilih dalam daftar.
gmp-requesterror
function(event)
Argumen: 
Peristiwa ini diaktifkan saat permintaan ke backend ditolak (misalnya, kunci API salah). Peristiwa ini tidak menggelembungkan.

Antarmuka PlaceListElementOptions

Antarmuka google.maps.places.PlaceListElementOptions

Opsi untuk PlaceListElement.
selectable optional
Jenis:  boolean optional
Lihat PlaceListElement.selectable

Class PlaceListPlaceSelectEvent

Class google.maps.places.PlaceListPlaceSelectEvent

Peristiwa ini dikeluarkan oleh PlaceListElement saat pengguna memilih tempat.

Class ini memperluas Event.

Akses dengan memanggil const {PlaceListPlaceSelectEvent} = await google.maps.importLibrary("places"). Lihat Library di Maps JavaScript API.
index
Jenis:  number
Indeks daftar tempat yang dipilih.
place
Jenis:  Place
Objek Place yang berisi ID, lokasi, dan area pandang tempat yang dipilih.

Class Autocomplete

Class google.maps.places.Autocomplete

Widget yang memberikan prediksi Tempat berdasarkan input teks pengguna. Elemen ini dilampirkan ke elemen input jenis text, dan memproses entri teks di kolom tersebut. Daftar prediksi ditampilkan sebagai daftar drop-down, dan diperbarui saat teks dimasukkan.

Class ini memperluas MVCObject.

Akses dengan memanggil const {Autocomplete} = await google.maps.importLibrary("places"). Lihat Library di Maps JavaScript API.
Autocomplete
Autocomplete(inputField[, opts])
Parameter: 
Membuat instance Autocomplete baru yang dilampirkan ke kolom teks input yang ditentukan dengan opsi yang diberikan.
getBounds
getBounds()
Parameter:  Tidak ada
Nilai yang Ditampilkan:  LatLngBounds|undefined Batas bias.
Menampilkan batas prediksi yang bias.
getFields
getFields()
Parameter:  Tidak ada
Nilai Hasil:  Array<string>|undefined
Menampilkan kolom yang akan disertakan untuk Tempat dalam respons detail saat detail berhasil diambil. Untuk mengetahui daftar kolom, lihat PlaceResult.
getPlace
getPlace()
Parameter:  Tidak ada
Nilai yang Ditampilkan:  PlaceResult Tempat yang dipilih oleh pengguna.
Menampilkan detail Tempat yang dipilih oleh pengguna jika detail berhasil diambil. Jika tidak, objek Place stub akan ditampilkan, dengan properti name ditetapkan ke nilai kolom input saat ini.
setBounds
setBounds(bounds)
Parameter: 
Nilai yang Ditampilkan:  Tidak ada
Menetapkan area pilihan tempat untuk menampilkan hasil Place. Hasilnya dibiaskan terhadap, tetapi tidak terbatas pada, area ini.
setComponentRestrictions
setComponentRestrictions(restrictions)
Parameter: 
Nilai yang Ditampilkan:  Tidak ada
Menetapkan batasan komponen. Pembatasan komponen digunakan untuk membatasi prediksi hanya pada prediksi dalam komponen induk. Misalnya, negara.
setFields
setFields(fields)
Parameter: 
  • fields:  Array<string> optional
Nilai yang Ditampilkan:  Tidak ada
Menetapkan kolom yang akan disertakan untuk Tempat dalam respons detail saat detail berhasil diambil. Untuk mengetahui daftar kolom, lihat PlaceResult.
setOptions
setOptions(options)
Parameter: 
Nilai yang Ditampilkan:  Tidak ada
setTypes
setTypes(types)
Parameter: 
  • types:  Array<string> optional Jenis prediksi yang akan disertakan.
Nilai yang Ditampilkan:  Tidak ada
Menetapkan jenis prediksi yang akan ditampilkan. Untuk jenis yang didukung, lihat panduan developer. Jika tidak ada jenis yang ditentukan, semua jenis akan ditampilkan.
Diwariskan: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
place_changed
function()
Argumen:  Tidak ada
Peristiwa ini diaktifkan saat PlaceResult tersedia untuk Tempat yang dipilih pengguna.
Jika pengguna memasukkan nama Tempat yang tidak disarankan oleh kontrol dan menekan tombol Enter, atau jika permintaan Place Details gagal, PlaceResult akan berisi input pengguna di properti name, tanpa properti lain yang ditentukan.

Antarmuka AutocompleteOptions

Antarmuka google.maps.places.AutocompleteOptions

Opsi yang dapat ditetapkan pada objek Autocomplete.
bounds optional
Area untuk menelusuri tempat.
componentRestrictions optional
Jenis:  ComponentRestrictions optional
Pembatasan komponen. Pembatasan komponen digunakan untuk membatasi prediksi hanya pada prediksi dalam komponen induk. Misalnya, negara.
fields optional
Jenis:  Array<string> optional
Kolom yang akan disertakan untuk Tempat dalam respons detail saat detail berhasil diambil, yang akan ditagih. Jika ['ALL'] diteruskan, semua kolom yang tersedia akan ditampilkan dan ditagih (hal ini tidak direkomendasikan untuk deployment produksi). Untuk mengetahui daftar kolom, lihat PlaceResult. Kolom bertingkat dapat ditentukan dengan jalur titik (misalnya, "geometry.location"). Defaultnya adalah ['ALL'].
placeIdOnly optional
Jenis:  boolean optional
Apakah hanya akan mengambil ID Tempat. PlaceResult yang tersedia saat peristiwa place_changed diaktifkan hanya akan memiliki kolom place_id, jenis, dan nama, dengan place_id, jenis, dan deskripsi yang ditampilkan oleh layanan Autocomplete. Dinonaktifkan secara default.
strictBounds optional
Jenis:  boolean optional
Nilai boolean, yang menunjukkan bahwa widget Autocomplete hanya boleh menampilkan tempat yang berada di dalam batas widget Autocomplete pada saat kueri dikirim. Menetapkan strictBounds ke false (yang merupakan setelan default) akan membuat hasil dibiaskan ke, tetapi tidak terbatas pada, tempat yang berada dalam batas.
types optional
Jenis:  Array<string> optional
Jenis prediksi yang akan ditampilkan. Untuk jenis yang didukung, lihat panduan developer. Jika tidak ada jenis yang ditentukan, semua jenis akan ditampilkan.

Class google.maps.places.SearchBox

Widget yang memberikan prediksi kueri berdasarkan input teks pengguna. Elemen ini dilampirkan ke elemen input jenis text, dan memproses entri teks di kolom tersebut. Daftar prediksi ditampilkan sebagai daftar drop-down, dan diperbarui saat teks dimasukkan.

Class ini memperluas MVCObject.

Akses dengan memanggil const {SearchBox} = await google.maps.importLibrary("places"). Lihat Library di Maps JavaScript API.
SearchBox
SearchBox(inputField[, opts])
Parameter: 
Membuat instance SearchBox baru yang dilampirkan ke kolom teks input yang ditentukan dengan opsi yang diberikan.
getBounds
getBounds()
Parameter:  Tidak ada
Nilai Hasil:  LatLngBounds|undefined
Menampilkan batas yang bias terhadap prediksi kueri.
getPlaces
getPlaces()
Parameter:  Tidak ada
Nilai Hasil:  Array<PlaceResult>|undefined
Menampilkan kueri yang dipilih oleh pengguna untuk digunakan dengan peristiwa places_changed.
setBounds
setBounds(bounds)
Parameter: 
Nilai yang Ditampilkan:  Tidak ada
Menetapkan region yang akan digunakan untuk membiaskan prediksi kueri. Hasil hanya akan dibiaskan ke area ini dan tidak sepenuhnya dibatasi pada area tersebut.
Diwariskan: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
places_changed
function()
Argumen:  Tidak ada
Peristiwa ini diaktifkan saat pengguna memilih kueri, getPlaces harus digunakan untuk mendapatkan tempat baru.

Antarmuka SearchBoxOptions

Antarmuka google.maps.places.SearchBoxOptions

Opsi yang dapat ditetapkan pada objek SearchBox.
bounds optional
Area yang akan digunakan untuk membiaskan prediksi kueri. Prediksi dibiaskan terhadap, tetapi tidak terbatas pada, kueri yang menargetkan batas ini.