PlaceAutocompleteElement 類別
google.maps.places.PlaceAutocompleteElement
類別
- PlaceAutocompleteElement 是
HTMLElement
子類別,可提供 Places Autocomplete API 的 UI 元件。載入places
程式庫後,即可在 HTML 中建立含有自動完成功能的輸入項目。例如:<gmp-placeautocomplete ></gmp-placeautocomplete>
自訂元素:
<gmp-placeautocomplete></gmp-placeautocomplete>
這個類別會擴充 HTMLElement
。
這個類別會實作 PlaceAutocompleteElementOptions
。
呼叫 const {PlaceAutocompleteElement} = await google.maps.importLibrary("places")
即可存取。請參閱 Maps JavaScript API 中的程式庫。
建構函式 | |
---|---|
PlaceAutocompleteElement |
PlaceAutocompleteElement(options) 參數:
|
屬性 | |
---|---|
inputElement |
類型:
HTMLInputElement 要顯示自動完成功能的輸入元素。 |
繼承:
componentRestrictions 、locationBias 、locationRestriction 、requestedLanguage 、requestedRegion 、types |
方法 | |
---|---|
|
addEventListener(type, listener[, options]) 參數:
傳回值:
void 設定函式,當指定事件傳送至目標時,就會呼叫函式。請參閱 addEventListener |
|
removeEventListener(type, listener[, options]) 參數:
傳回值:
void 從目標中移除先前使用 addEventListener 註冊的事件監聽器。請參閱 removeEventListener |
PlaceAutocompleteElementOptions 介面
google.maps.places.PlaceAutocompleteElementOptions
介面
PlaceAutocompleteElement 的建構選項。
屬性 | |
---|---|
inputElement |
類型:
HTMLInputElement 要顯示自動完成功能的輸入元素。 |
componentRestrictions optional |
類型:
ComponentRestrictions optional 元件限制。元件限制是用來將預測結果限制在父項元件中。例如國家/地區。 |
locationBias optional |
類型:
LocationBias optional 搜尋地點時使用的柔邊界線或提示。 |
locationRestriction optional |
類型:
LocationRestriction optional 限制搜尋結果的邊界。 |
requestedLanguage optional |
類型:
string optional 傳回結果時使用的語言 ID (如有)。所選語言的搜尋結果可能會取得較高的排名,但 Google 僅針對這種語言提供建議。請參閱支援語言清單。 |
requestedRegion optional |
類型:
string optional 用於設定結果格式和篩選結果的區域代碼。我們不會在此國家/地區提供推薦內容。區碼接受 ccTLD (「頂層網域」) 雙字元值。多數 ccTLD 代碼與 ISO 3166-1 代碼相同,只有少數例外。舉例來說,英國的 ccTLD 是「uk」( .co.uk ),但 ISO 3166-1 代碼卻是「gb」(正式的國是「大不列顛暨北愛爾蘭聯合王國」)。 |
types optional |
類型:
Array<string> optional 要傳回的預測結果類型。如要瞭解支援的類型,請參閱 開發人員指南。如果沒有指定類型,就會傳回所有類型。 |
PlaceAutocompletePlaceSelectEvent 類別
google.maps.places.PlaceAutocompletePlaceSelectEvent
類別
使用者透過 Place Autocomplete 元素選取地點後,系統就會建立此事件。透過 event.place
存取所選項目。
這個類別會擴充 Event
。
呼叫 const {PlaceAutocompletePlaceSelectEvent} = await google.maps.importLibrary("places")
即可存取。請參閱 Maps JavaScript API 中的程式庫。
屬性 | |
---|---|
|
類型:
Place |
PlaceAutocompleteRequestErrorEvent 類別
google.maps.places.PlaceAutocompleteRequestErrorEvent
類別
當網路要求發生問題時,PlaceAutocompleteElement 會發出這個事件。
這個類別會擴充 Event
。
呼叫 const {PlaceAutocompleteRequestErrorEvent} = await google.maps.importLibrary("places")
即可存取。請參閱 Maps JavaScript API 中的程式庫。
Autocomplete 類別
google.maps.places.Autocomplete
類別
這個小工具可根據使用者輸入文字提供地點預測結果。這個模組會附加至 text
類型的輸入元素,並監聽該欄位中的文字輸入。預測清單會以下拉式清單顯示,並隨著使用者輸入文字更新。
這個類別會擴充 MVCObject
。
呼叫 const {Autocomplete} = await google.maps.importLibrary("places")
即可存取。請參閱 Maps JavaScript API 中的程式庫。
建構函式 | |
---|---|
Autocomplete |
Autocomplete(inputField[, opts]) 參數:
建立 Autocomplete 的新例項,該例項會附加至指定的輸入文字欄位,其中包含指定的選項。 |
方法 | |
---|---|
getBounds |
getBounds() 參數:無
傳回值:
LatLngBounds|undefined 自訂調整範圍。傳回預測調整的邊界。 |
getFields |
getFields() 參數:無
傳回值:
Array<string>|undefined 傳回成功擷取詳細資料時,要在詳細資料回應中加入的「地點」欄位。如需欄位清單,請參閱 PlaceResult 。 |
getPlace |
getPlace() 參數:無
傳回值:
PlaceResult 使用者選取的地點。如果詳細資料擷取成功,傳回使用者所選地點的詳細資料。否則會傳回虛設常式地點物件,並將 name 屬性設為輸入欄位的目前值。 |
setBounds |
setBounds(bounds) 參數:
傳回值:None
設定要傳回「地點」結果的偏好區域。結果可能會優先 (但不限於) 這個地區。 |
setComponentRestrictions |
setComponentRestrictions(restrictions) 參數:
傳回值:None
設定元件限制。元件限制是用來將預測結果限制在父項元件中。例如國家/地區。 |
setFields |
setFields(fields) 參數:
傳回值:None
設定成功擷取詳細資料時,要在詳細資料回應中納入「地點」的欄位。如需欄位清單,請參閱 PlaceResult 。 |
setOptions |
setOptions(options) 參數:
傳回值:None
|
setTypes |
setTypes(types) 參數:
傳回值:None
設定要傳回的預測結果類型。如要瞭解支援的類型,請參閱 開發人員指南。如果沒有指定類型,就會傳回所有類型。 |
繼承:
addListener 、bindTo 、get 、notify 、set 、setValues 、unbind 、unbindAll
|
活動 | |
---|---|
place_changed |
function() 引數:無
使用者選取的地點提供 PlaceResult 時,就會觸發此事件。如果使用者輸入控制項未建議的地點名稱,並按下 Enter 鍵,或者 Place Details 要求失敗, PlaceResult 會包含使用者在 name 屬性中輸入的使用者輸入內容,且未定義其他屬性。 |
AutocompleteOptions 介面
google.maps.places.AutocompleteOptions
介面
可設定在 Autocomplete
物件上的選項。
屬性 | |
---|---|
bounds optional |
類型:
LatLngBounds|LatLngBoundsLiteral optional 要搜尋地點的區域。 |
componentRestrictions optional |
類型:
ComponentRestrictions optional 元件限制。元件限制是用來將預測結果限制在父項元件中。例如國家/地區。 |
fields optional |
類型:
Array<string> optional 成功擷取詳細資料後,要用於詳細資料回應中要納入的地點欄位,計費方式。如果傳入 ['ALL'] ,系統將傳回所有可用的欄位並計費 (不適用於實際工作環境部署作業)。如需欄位清單,請參閱 PlaceResult 。巢狀欄位可使用點路徑 (例如 "geometry.location" ) 指定。預設值為 ['ALL'] 。 |
|
類型:
boolean optional 是否僅擷取地點 ID。觸發 place_changed 事件時提供的 PlaceResult 只會包含 place_id、類型和名稱欄位,其中 place_id、類型和說明則由自動完成服務傳回。預設為停用。 |
strictBounds optional |
類型:
boolean optional 布林值,表示「自動完成」小工具只會在查詢傳送時,傳回位於 Autocomplete 小工具範圍內的地點。如果將 strictBounds 設為 false (預設值),結果會優先 (但不限於) 顯示邊界內的地點。 |
types optional |
類型:
Array<string> optional 要傳回的預測結果類型。如要瞭解支援的類型,請參閱 開發人員指南。如果沒有指定類型,就會傳回所有類型。 |
SearchBox 類別
google.maps.places.SearchBox
類別
這個小工具可根據使用者輸入文字提供預測內容。這個模組會附加至 text
類型的輸入元素,並監聽該欄位中的文字輸入。預測清單會以下拉式清單顯示,並隨著使用者輸入文字更新。
這個類別會擴充 MVCObject
。
呼叫 const {SearchBox} = await google.maps.importLibrary("places")
即可存取。請參閱 Maps JavaScript API 中的程式庫。
建構函式 | |
---|---|
SearchBox |
SearchBox(inputField[, opts]) 參數:
建立 SearchBox 的新例項,該例項會附加至指定的輸入文字欄位,其中包含指定的選項。 |
方法 | |
---|---|
getBounds |
getBounds() 參數:無
傳回值:
LatLngBounds|undefined 傳回查詢預測調整的邊界。 |
getPlaces |
getPlaces() 參數:無
傳回值:
Array<PlaceResult>|undefined 傳回使用者選取的查詢,要與 places_changed 事件搭配使用。 |
setBounds |
setBounds(bounds) 參數:
傳回值:None
設定自訂調整查詢預測結果的區域。結果只會偏向在這個領域,不會完全受限。 |
繼承:
addListener 、bindTo 、get 、notify 、set 、setValues 、unbind 、unbindAll
|
活動 | |
---|---|
places_changed |
function() 引數:無
使用者選取查詢時,會觸發這個事件, getPlaces 應用於取得新地點。 |
SearchBoxOptions 介面
google.maps.places.SearchBoxOptions
介面
可設定在 SearchBox
物件上的選項。
屬性 | |
---|---|
bounds optional |
類型:
LatLngBounds|LatLngBoundsLiteral optional 查詢預測結果偏誤的範圍。預測功能可能會優先 (但不限於) 指定這些邊界的查詢。 |