Places Widgets

PlaceAutocompleteElement 類別

google.maps.places.PlaceAutocompleteElement 類別

PlaceAutocompleteElement 是 HTMLElement 子類別，可提供 Places Autocomplete API 的 UI 元件。

自訂元素：
<gmp-place-autocomplete name="string" requested-language="string" requested-region="string" types="type1 type2 type3..."></gmp-place-autocomplete>

這個類別會擴充 HTMLElement。

這個類別會實作 PlaceAutocompleteElementOptions。

呼叫 const {PlaceAutocompleteElement} = await google.maps.importLibrary("places") 即可存取。請參閱 Maps JavaScript API 中的程式庫。
PlaceAutocompleteElement
PlaceAutocompleteElement(options)
參數： 
componentRestrictions
類型：  ComponentRestrictions optional
元件限制。元件限制的用途是限制系統只能預測父項元件中的項目。例如國家/地區。
locationBias
類型：  LocationBias optional
搜尋地點時要使用的軟邊界或提示。
locationRestriction
類型：  LocationRestriction optional
限制搜尋結果的範圍。
name
類型：  string optional
要用於輸入元素的名稱。詳情請參閱 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name。遵循輸入輸入名稱屬性的行為。請注意，這是在提交表單時要使用的名稱。詳情請參閱 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form。
HTML 屬性：
  • <gmp-placeautocomplete name="string"></gmp-placeautocomplete>
requestedLanguage
類型：  string optional
傳回結果的語言 ID (如果可以的話)。所選語言的搜尋結果也許能獲得較高排名，但建議並不限於這個語言。請參閱支援語言清單。
HTML 屬性：
  • <gmp-place-autocomplete requested-language="string"></gmp-place-autocomplete>
requestedRegion
類型：  string optional
用於結果格式及篩選結果的區碼。這項設定不會限制建議在這個國家/地區顯示。區碼接受 ccTLD (「頂層網域」) 的兩位字元值多數 ccTLD 代碼與 ISO 3166-1 代碼相同，只有少數例外。舉例來說，英國的 ccTLD 是「uk」(.co.uk)，但 ISO 3166-1 代碼卻是「gb」(正式的國名是「大不列顛暨北愛爾蘭聯合王國」)。
HTML 屬性：
  • <gmp-place-autocomplete requested-region="string"></gmp-place-autocomplete>
types
類型：  Array<string> optional
要傳回的預測結果類型。如需瞭解支援的類型，請參閱 開發人員指南。如果沒有指定類型，系統就會傳回所有類型。
HTML 屬性：
  • <gmp-place-autocomplete types="type1 type2 type3..."></gmp-place-autocomplete>
prediction-item
預測結果下拉式選單中的項目，代表單一預測。
prediction-item-icon
顯示在預測查詢字串清單中每個項目左側的圖示。
prediction-item-main-text
預測項目的一部分，是預測結果的主要文字。就地理位置而言，這包含地方資訊名稱 (例如「Sydney」) 或街道名稱及門牌號碼 (例如「10 King Street」)。根據預設，Predict-item-main-text 會顯示黑色。如果預測項目中有任何額外文字，則不在預測項目內，且會從預測項目沿用其樣式。在預設情況下會以灰色顯示。這組額外文字通常是地址。
prediction-item-match
傳回的預測查詢字串中，與使用者輸入文字相符的部分。根據預設，這組相符文字會以粗體字標示。請注意，相符文字可能會在預測項目內的任何位置，不一定是 Predict-item-main-text 的一部分。
prediction-item-selected
使用者透過鍵盤前往的項目。注意：所選項目都會受到這個元件樣式和預測項目部分的樣式影響。
prediction-list
包含「地方資訊自動完成」服務所傳回預測查詢字串清單的視覺元素。這份清單會以下拉式清單的形式，顯示在 PlaceAutocompleteElement 下方。
BetaaddEventListener
addEventListener(type, listener[, options])
參數： 
  • type：string 這是區分大小寫的字串，代表要監聽的事件類型。
  • listener：EventListener|EventListenerObject 接收通知的物件。這必須是內含 handleEvent 方法的函式或物件
  • options：boolean|AddEventListenerOptions optional 查看選項。自訂事件僅支援 capture 和 passive。
傳回值：  void
設定會在指定事件傳送至目標時呼叫的函式。詳情請參閱 addEventListener
BetaremoveEventListener
removeEventListener(type, listener[, options])
參數： 
傳回值：  void
從目標中移除先前使用 addEventListener 註冊的事件監聽器。詳情請參閱「removeEventListener」
gmp-placeselect
function(placeAutocompletePlaceSelectEvent)
引數： 
使用者選取地點預測結果時，會觸發此事件。此屬性包含 Place 物件。
gmp-requesterror
function(placeAutocompleteRequestErrorEvent)
引數： 
向後端發出的要求遭拒 (例如錯誤的 API 金鑰) 時，會觸發此事件。這場活動不會以對話框形式顯示。

PlaceAutocompleteElementOptions 介面

google.maps.places.PlaceAutocompleteElementOptions 介面

建構 PlaceAutocompleteElement 的選項。
componentRestrictions optional
類型：  ComponentRestrictions optional
查看「PlaceAutocompleteElement.componentRestrictions」
locationBias optional
類型：  LocationBias optional
查看「PlaceAutocompleteElement.locationBias」
locationRestriction optional
類型：  LocationRestriction optional
查看「PlaceAutocompleteElement.locationRestriction」
requestedLanguage optional
類型：  string optional
查看「PlaceAutocompleteElement.requestedLanguage」
requestedRegion optional
類型：  string optional
查看「PlaceAutocompleteElement.requestedRegion」
types optional
類型：  Array<string> optional
查看「PlaceAutocompleteElement.types」

PlaceAutocompletePlaceSelectEvent 類別

google.maps.places.PlaceAutocompletePlaceSelectEvent 類別

使用者利用 Place Autocomplete 元素選取地點後，系統就會建立此事件。使用 event.place 存取所選項目。

這個類別會擴充 Event。

呼叫 const {PlaceAutocompletePlaceSelectEvent} = await google.maps.importLibrary("places") 即可存取。請參閱 Maps JavaScript API 中的程式庫。
Betaplace
類型：  Place

PlaceAutocompleteRequestErrorEvent 類別

google.maps.places.PlaceAutocompleteRequestErrorEvent 類別

當網路要求發生問題時，PlaceAutocompleteElement 會引發這個事件。

這個類別會擴充 Event。

呼叫 const {PlaceAutocompleteRequestErrorEvent} = await google.maps.importLibrary("places") 即可存取。請參閱 Maps JavaScript API 中的程式庫。

Autocomplete 類別

google.maps.places.Autocomplete 類別

這個小工具可根據使用者輸入文字提供 Place 預測結果。此項目會附加至 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 使用者選取的地點。
如果已成功擷取詳細資料，則傳回使用者所選取地點的詳細資料。否則會傳回虛設常式 Place 物件，並將 name 屬性設為輸入欄位目前的值。
setBounds
setBounds(bounds)
參數： 
傳回值：無
設定要傳回「地點」結果的偏好區域。結果可能會偏誤 (但不僅限於這個區域)。
setComponentRestrictions
setComponentRestrictions(restrictions)
參數： 
傳回值：無
設定元件限制。元件限制的用途是限制系統只能預測父項元件中的項目。例如國家/地區。
setFields
setFields(fields)
參數： 
  • fields：Array<string> optional
傳回值：無
設定成功擷取詳細資料時，要在詳細資料回應中納入「地點」的欄位。如需欄位清單，請參閱 PlaceResult。
setOptions
setOptions(options)
參數： 
傳回值：無
setTypes
setTypes(types)
參數： 
  • types：Array<string> optional 要包含的預測類型。
傳回值：無
設定要傳回的預測結果類型。如需瞭解支援的類型，請參閱 開發人員指南。如果沒有指定類型，系統就會傳回所有類型。
沿用： 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']。
placeIdOnly optional
類型：  boolean optional
是否只擷取地點 ID。引發 place_changed 事件時所提供的 PlaceResult 只含有 place_id、type 和 name 欄位，以及由 Autocomplete 服務傳回的 place_id、type 和 description。預設為停用。
strictBounds optional
類型：  boolean optional
布林值，表示自動完成小工具只能傳回查詢發出時，自動完成小工具邊界內的地點。將 strictBounds 設為 false (預設值) 會調整結果的優先範圍 (但不限於) 邊界內的地點。
types optional
類型：  Array<string> optional
要傳回的預測結果類型。如需瞭解支援的類型，請參閱 開發人員指南。如果沒有指定類型，系統就會傳回所有類型。

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)
參數： 
傳回值：無
設定自訂預測查詢所使用的區域。結果只會優先顯示在此區域，而不會完全只限於該區域。
沿用： addListener、bindTo、get、notify、set、setValues、unbind、unbindAll
places_changed
function()
引數：無
使用者選取查詢時，會觸發此事件，應使用 getPlaces 取得新地點。

SearchBoxOptions 介面

google.maps.places.SearchBoxOptions 介面

可為 SearchBox 物件設定的選項。
bounds optional
類型：  LatLngBounds|LatLngBoundsLiteral optional
查詢預測結果自訂調整依據的區域。預測作業可能會優先 (但不限於) 指定這些邊界的查詢。