Places Widgets

PlaceAutocompleteElement class

google.maps.places.PlaceAutocompleteElement ชั้นเรียน

PlaceAutocompleteElement เป็นHTMLElementคลาสย่อยที่ให้คอมโพเนนต์ UI สำหรับ Places Autocomplete API

องค์ประกอบที่กำหนดเอง:
<gmp-place-autocomplete included-primary-types="type1 type2 type3..." included-region-codes="c1 c2 c3..." name="string" origin="lat,lng|lat,lng,altitude" requested-language="string" requested-region="string" unit-system="metric|imperial" types="type1 type2 type3..."></gmp-place-autocomplete>

ชั้นเรียนนี้ขยายเวลา HTMLElement

คลาสนี้ใช้ PlaceAutocompleteElementOptions

เข้าถึงได้โดยโทรไปที่ const {PlaceAutocompleteElement} = await google.maps.importLibrary("places")
ดูไลบรารีใน Maps JavaScript API

PlaceAutocompleteElement
PlaceAutocompleteElement(options)
พารามิเตอร์: 
AlphaincludedPrimaryTypes
ประเภท:  Array<string> optional
ประเภทสถานที่หลักที่รวมไว้ (เช่น "restaurant" หรือ "gas_station")

ระบบจะแสดงสถานที่ก็ต่อเมื่อประเภทหลักของสถานที่นั้นรวมอยู่ในรายการนี้ โดยระบุได้สูงสุด 5 ค่า หากไม่ได้ระบุประเภท ระบบจะแสดงผลสถานที่ทุกประเภท
แอตทริบิวต์ HTML:
  • <gmp-place-autocomplete included-primary-types="type1 type2 type3..."></gmp-place-autocomplete>
AlphaincludedRegionCodes
ประเภท:  Array<string> optional
รวมเฉพาะผลการค้นหาในภูมิภาคที่ระบุ โดยระบุเป็นรหัสภูมิภาค 2 อักขระของ CLDR ได้สูงสุด 15 รายการ ชุดข้อมูลที่ว่างเปล่าจะไม่จำกัดผลลัพธ์ หากตั้งค่าทั้ง locationRestriction และ includedRegionCodes ผลลัพธ์จะอยู่ในพื้นที่ที่ทับซ้อนกัน
แอตทริบิวต์ HTML:
  • <gmp-place-autocomplete included-region-codes="c1 c2 c3..."></gmp-place-autocomplete>
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-place-autocomplete name="string"></gmp-place-autocomplete>
Alphaorigin
ต้นทางที่จะคำนวณระยะทาง หากไม่ได้ระบุ ระบบจะไม่คำนวณระยะทาง ระบบจะไม่ใช้ระดับความสูงในการคำนวณหากมีการระบุ
แอตทริบิวต์ HTML:
  • <gmp-place-autocomplete origin="lat,lng|lat,lng,altitude"></gmp-place-autocomplete>
requestedLanguage
ประเภท:  string optional
ตัวระบุภาษาสำหรับภาษาที่ควรแสดงผลลัพธ์ (หากเป็นไปได้) ผลการค้นหาในภาษาที่เลือกอาจได้รับการจัดอันดับสูงขึ้น แต่คำแนะนำไม่ได้จำกัดอยู่แค่ในภาษานี้ ดูรายการภาษาที่รองรับ
แอตทริบิวต์ HTML:
  • <gmp-place-autocomplete requested-language="string"></gmp-place-autocomplete>
requestedRegion
ประเภท:  string optional
รหัสภูมิภาคที่ใช้สำหรับการจัดรูปแบบผลลัพธ์และการกรองผลลัพธ์ แต่ไม่ได้จำกัดการแนะนำไว้เฉพาะในประเทศนี้ รหัสภูมิภาคยอมรับค่า ccTLD ("โดเมนระดับบนสุด") ที่มีอักขระ 2 ตัว รหัส ccTLD ส่วนใหญ่จะเหมือนกับรหัส ISO 3166-1 แต่ก็มีข้อยกเว้นที่สำคัญบางประการ เช่น ccTLD ของสหราชอาณาจักรคือ "uk" (.co.uk) ขณะที่รหัส ISO 3166-1 คือ "gb" (ในทางเทคนิคสำหรับนิติบุคคล "สหราชอาณาจักรบริเตนใหญ่และไอร์แลนด์เหนือ")
แอตทริบิวต์ HTML:
  • <gmp-place-autocomplete requested-region="string"></gmp-place-autocomplete>
AlphaunitSystem
ประเภท:  UnitSystem optional
ระบบหน่วยที่ใช้เพื่อแสดงระยะทาง หากไม่ได้ระบุ ระบบจะกำหนดระบบหน่วยตาม requestedRegion
แอตทริบิวต์ HTML:
  • <gmp-place-autocomplete unit-system="metric|imperial"></gmp-place-autocomplete>
BetacomponentRestrictions
ประเภท:  ComponentRestrictions optional
ข้อจำกัดของคอมโพเนนต์ ข้อจำกัดของคอมโพเนนต์ใช้เพื่อจำกัดการคาดการณ์ให้เฉพาะภายในคอมโพเนนต์หลัก เช่น ประเทศ
Betatypes
ประเภท:  Array<string> optional
ประเภทของการคาดการณ์ที่จะแสดง ดูประเภทที่รองรับได้ใน คู่มือสำหรับนักพัฒนาซอฟต์แวร์ หากไม่ได้ระบุประเภท ระบบจะแสดงผลประเภททั้งหมด
แอตทริบิวต์ HTML:
  • <gmp-place-autocomplete types="type1 type2 type3..."></gmp-place-autocomplete>
prediction-item
รายการในการคาดคะเนแบบเลื่อนลงซึ่งแสดงการคาดคะเนรายการเดียว
prediction-item-icon
ไอคอนที่แสดงทางด้านซ้ายของแต่ละรายการในรายการการคาดคะเน
prediction-item-main-text
ส่วนของรายการการคาดการณ์ที่เป็นข้อความหลักของการคาดการณ์ สำหรับสถานที่ทางภูมิศาสตร์ ฟิลด์นี้จะมีชื่อสถานที่ เช่น "ซิดนีย์" หรือชื่อและหมายเลขถนน เช่น "10 ถนนคิง" โดยค่าเริ่มต้น ระบบจะระบายสีดำให้กับข้อความหลักของรายการการคาดคะเน หากมีข้อความเพิ่มเติมใน prediction-item ข้อความนั้นจะอยู่นอก prediction-item-main-text และรับรูปแบบจาก prediction-item โดยจะมีสีเทาเป็นค่าเริ่มต้น โดยปกติแล้ว ข้อความเพิ่มเติมจะเป็นที่อยู่
prediction-item-match
ส่วนของการคาดการณ์ที่ส่งกลับซึ่งตรงกับอินพุตของผู้ใช้ โดยค่าเริ่มต้น ระบบจะไฮไลต์ข้อความที่ตรงกันนี้เป็นตัวหนา โปรดทราบว่าข้อความที่ตรงกันอาจอยู่ที่ใดก็ได้ภายใน prediction-item ซึ่งไม่จำเป็นต้องเป็นส่วนหนึ่งของ prediction-item-main-text
prediction-item-selected
รายการเมื่อผู้ใช้ไปยังรายการนั้นผ่านแป้นพิมพ์ หมายเหตุ: รายการที่เลือกจะได้รับผลกระทบจากทั้งสไตล์ของส่วนนี้และสไตล์ของส่วนรายการที่คาดการณ์
prediction-list
องค์ประกอบภาพที่มีรายการการคาดคะเนที่บริการเติมข้อความอัตโนมัติของสถานที่ส่งคืน รายการนี้จะปรากฏเป็นรายการแบบเลื่อนลงใต้ PlaceAutocompleteElement
BetaaddEventListener
addEventListener(type, listener[, options])
พารามิเตอร์: 
  • typestring สตริงที่คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่ซึ่งแสดงถึงประเภทเหตุการณ์ที่จะรับฟัง
  • listenerEventListener|EventListenerObject ออบเจ็กต์ที่ได้รับการแจ้งเตือน ซึ่งต้องเป็นฟังก์ชันหรือออบเจ็กต์ที่มีเมธอด handleEvent
  • optionsboolean|AddEventListenerOptions optional ดูตัวเลือก เหตุการณ์ที่กำหนดเองรองรับเฉพาะ capture และ passive
ค่าที่ส่งคืน:  void
ตั้งค่าฟังก์ชันที่จะเรียกใช้เมื่อใดก็ตามที่มีการส่งเหตุการณ์ที่ระบุไปยังเป้าหมาย ดู addEventListener
BetaremoveEventListener
removeEventListener(type, listener[, options])
พารามิเตอร์: 
  • typestring สตริงที่ระบุประเภทของเหตุการณ์ที่จะนำเครื่องมือฟังเหตุการณ์ออก
  • listenerEventListener|EventListenerObject Listener เหตุการณ์ของตัวแฮนเดิลเหตุการณ์ที่จะนำออกจากเป้าหมายเหตุการณ์
  • optionsboolean|EventListenerOptions optional ดูตัวเลือก
ค่าที่ส่งคืน:  void
นำ Listener เหตุการณ์ที่ลงทะเบียนไว้ก่อนหน้านี้ด้วย addEventListener ออกจากเป้าหมาย ดู removeEventListener
gmp-error
function(errorEvent)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อคำขอไปยังแบ็กเอนด์ถูกปฏิเสธ (เช่น คีย์ API ไม่ถูกต้อง) เหตุการณ์นี้จะไม่ฟอง
gmp-select
function(placePredictionSelectEvent)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อผู้ใช้เลือกการคาดคะเนสถานที่ มีออบเจ็กต์ PlacePrediction ซึ่งแปลงเป็นออบเจ็กต์ Place ได้
gmp-placeselect
function(placeAutocompletePlaceSelectEvent)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อผู้ใช้เลือกการคาดคะเนสถานที่ มีออบเจ็กต์สถานที่

PlaceAutocompleteElementOptions อินเทอร์เฟซ

google.maps.places.PlaceAutocompleteElementOptions อินเทอร์เฟซ

ตัวเลือกสำหรับการสร้าง PlaceAutocompleteElement ดูคำอธิบายของแต่ละพร็อพเพอร์ตี้ได้ในพร็อพเพอร์ตี้ที่มีชื่อเดียวกันในคลาส PlaceAutocompleteElement

BetacomponentRestrictions optional
ประเภท:  ComponentRestrictions optional
AlphaincludedPrimaryTypes optional
ประเภท:  Array<string> optional
AlphaincludedRegionCodes optional
ประเภท:  Array<string> optional
locationBias optional
ประเภท:  LocationBias optional
locationRestriction optional
ประเภท:  LocationRestriction optional
name optional
ประเภท:  string optional
Alphaorigin optional
requestedLanguage optional
ประเภท:  string optional
Betatypes optional
ประเภท:  Array<string> optional
AlphaunitSystem optional
ประเภท:  UnitSystem optional

PlaceAutocompletePlaceSelectEvent class

google.maps.places.PlaceAutocompletePlaceSelectEvent ชั้นเรียน

เหตุการณ์นี้จะสร้างขึ้นหลังจากที่ผู้ใช้เลือกสถานที่ด้วยองค์ประกอบ Place Autocomplete เข้าถึงการเลือกด้วย event.place

ชั้นเรียนนี้ขยายเวลา Event

เข้าถึงได้โดยโทรไปที่ const {PlaceAutocompletePlaceSelectEvent} = await google.maps.importLibrary("places")
ดูไลบรารีใน Maps JavaScript API

Betaplace
ประเภท:  Place

PlacePredictionSelectEvent class

google.maps.places.PlacePredictionSelectEvent ชั้นเรียน

ระบบจะสร้างเหตุการณ์นี้หลังจากที่ผู้ใช้เลือกรายการการคาดคะเนด้วย PlaceAutocompleteElement เข้าถึงการเลือกด้วย event.placePrediction

ชั้นเรียนนี้ขยายเวลา Event

เข้าถึงได้โดยโทรไปที่ const {PlacePredictionSelectEvent} = await google.maps.importLibrary("places")
ดูไลบรารีใน Maps JavaScript API

placePrediction
ประเภท:  PlacePrediction

PlaceAutocompleteRequestErrorEvent class

google.maps.places.PlaceAutocompleteRequestErrorEvent ชั้นเรียน

เหตุการณ์นี้จะปล่อยโดย PlaceAutocompleteElement เมื่อมีปัญหาเกี่ยวกับคำขอเครือข่าย

ชั้นเรียนนี้ขยายเวลา Event

เข้าถึงได้โดยโทรไปที่ const {PlaceAutocompleteRequestErrorEvent} = await google.maps.importLibrary("places")
ดูไลบรารีใน Maps JavaScript API

PlaceDetailsElement class

google.maps.places.PlaceDetailsElement ชั้นเรียน

องค์ประกอบ HTML ที่แสดงรายละเอียดของสถานที่ ใช้วิธี configureFromPlace() หรือ configureFromLocation() เพื่อระบุเนื้อหาที่จะแสดง หากต้องการใช้องค์ประกอบรายละเอียดสถานที่ ให้เปิดใช้ Places UI Kit API สำหรับโปรเจ็กต์ใน Google Cloud Console

องค์ประกอบที่กำหนดเอง:
<gmp-place-details size="small"></gmp-place-details>

ชั้นเรียนนี้ขยายเวลา HTMLElement

คลาสนี้ใช้ PlaceDetailsElementOptions

เข้าถึงได้โดยโทรไปที่ const {PlaceDetailsElement} = await google.maps.importLibrary("places")
ดูไลบรารีใน Maps JavaScript API

PlaceDetailsElement
PlaceDetailsElement([options])
พารามิเตอร์: 
place
ประเภท:  Place optional
อ่านอย่างเดียว Place ออบเจ็กต์ที่มีรหัส สถานที่ตั้ง และวิวพอร์ตของสถานที่ที่แสดงผลในปัจจุบัน
size
ประเภท:  PlaceDetailsSize optional
ตัวแปรขนาดของ PlaceDetailsElement โดยค่าเริ่มต้น องค์ประกอบจะแสดง PlaceDetailsSize.X_LARGE
แอตทริบิวต์ 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])
พารามิเตอร์: 
  • typestring สตริงที่คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่ซึ่งแสดงถึงประเภทเหตุการณ์ที่จะรับฟัง
  • listenerEventListener|EventListenerObject ออบเจ็กต์ที่ได้รับการแจ้งเตือน ซึ่งต้องเป็นฟังก์ชันหรือออบเจ็กต์ที่มีเมธอด handleEvent
  • optionsboolean|AddEventListenerOptions optional ดูตัวเลือก เหตุการณ์ที่กำหนดเองรองรับเฉพาะ capture และ passive
ค่าที่ส่งคืน:  void
ตั้งค่าฟังก์ชันที่จะเรียกใช้เมื่อใดก็ตามที่มีการส่งเหตุการณ์ที่ระบุไปยังเป้าหมาย ดู addEventListener
configureFromLocation
configureFromLocation(location)
พารามิเตอร์: 
  • locationLatLng|LatLngLiteral ตำแหน่งที่จะแสดงรายละเอียดสถานที่
ค่าที่ส่งคืน:  Promise<void> สัญญาที่ได้รับการแก้ไขเมื่อโหลดและแสดงข้อมูลสถานที่แล้ว
กำหนดค่าวิดเจ็ตจาก LatLng โดยใช้การเข้ารหัสพิกัดภูมิศาสตร์แบบย้อนกลับ
configureFromPlace
configureFromPlace(place)
พารามิเตอร์: 
  • placePlace|{id:string} สถานที่ที่จะแสดงรายละเอียด
ค่าที่ส่งคืน:  Promise<void> สัญญาที่ได้รับการแก้ไขเมื่อโหลดและแสดงข้อมูลสถานที่แล้ว
กำหนดค่าวิดเจ็ตจากออบเจ็กต์ Place หรือรหัสสถานที่
BetaremoveEventListener
removeEventListener(type, listener[, options])
พารามิเตอร์: 
  • typestring สตริงที่ระบุประเภทของเหตุการณ์ที่จะนำเครื่องมือฟังเหตุการณ์ออก
  • listenerEventListener|EventListenerObject Listener เหตุการณ์ของตัวแฮนเดิลเหตุการณ์ที่จะนำออกจากเป้าหมายเหตุการณ์
  • optionsboolean|EventListenerOptions optional ดูตัวเลือก
ค่าที่ส่งคืน:  void
นำ Listener เหตุการณ์ที่ลงทะเบียนไว้ก่อนหน้านี้ด้วย addEventListener ออกจากเป้าหมาย ดู removeEventListener
gmp-load
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อองค์ประกอบโหลดและแสดงเนื้อหา เหตุการณ์นี้จะไม่ฟอง
gmp-requesterror
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อคำขอไปยังแบ็กเอนด์ถูกปฏิเสธ (เช่น คีย์ API ไม่ถูกต้อง) เหตุการณ์นี้จะไม่ฟอง

PlaceDetailsElementOptions อินเทอร์เฟซ

google.maps.places.PlaceDetailsElementOptions อินเทอร์เฟซ

ตัวเลือกสำหรับ PlaceDetailsElement

size optional
ประเภท:  PlaceDetailsSize optional

PlaceDetailsSize ค่าคงที่

google.maps.places.PlaceDetailsSize ค่าคงที่

รายละเอียดปลีกย่อยของขนาดสำหรับ PlaceDetailsElement

เข้าถึงได้โดยโทรไปที่ const {PlaceDetailsSize} = await google.maps.importLibrary("places")
ดูไลบรารีใน Maps JavaScript API

LARGE รูปแบบขนาดใหญ่ที่มีรูปภาพขนาดใหญ่ ข้อมูลพื้นฐาน และข้อมูลติดต่อ
MEDIUM ตัวแปรขนาดกลางซึ่งรวมถึงรูปภาพขนาดใหญ่และข้อมูลพื้นฐาน
SMALL ตัวแปรขนาดเล็กที่มีรูปภาพขนาดเล็กและข้อมูลพื้นฐาน
X_LARGE รูปแบบขนาดใหญ่พิเศษซึ่งรวมถึงภาพคอลลาจ รีวิว และข้อมูลสถานที่ที่ครอบคลุม

PlaceListElement class

google.maps.places.PlaceListElement ชั้นเรียน

องค์ประกอบ HTML ที่แสดงผลการค้นหาสถานที่ในรายการ ใช้เมธอด configureFromSearchByTextRequest() หรือ configureFromSearchNearbyRequest() เพื่อระบุคำขอให้แสดงผลลัพธ์ หากต้องการใช้องค์ประกอบรายการสถานที่ ให้เปิดใช้ Places UI Kit API สำหรับโปรเจ็กต์ใน Google Cloud Console

องค์ประกอบที่กำหนดเอง:
<gmp-place-list selectable></gmp-place-list>

ชั้นเรียนนี้ขยายเวลา HTMLElement

คลาสนี้ใช้ PlaceListElementOptions

เข้าถึงได้โดยโทรไปที่ const {PlaceListElement} = await google.maps.importLibrary("places")
ดูไลบรารีใน Maps JavaScript API

PlaceListElement
PlaceListElement([options])
พารามิเตอร์: 
places
ประเภท:  Array<Place>
อ่านอย่างเดียว อาร์เรย์ของออบเจ็กต์ Place ที่มีรหัส ตำแหน่ง และวิวพอร์ตของสถานที่ที่แสดงผลในปัจจุบัน
selectable
ประเภท:  boolean
รายการในลิสต์เลือกได้หรือไม่ หากเป็นจริง รายการจะกลายเป็นปุ่มที่ส่งเหตุการณ์ gmp-placeselect เมื่อคลิก นอกจากนี้ยังรองรับการไปยังส่วนต่างๆ และการเลือกด้วยแป้นพิมพ์ที่เข้าถึงได้ด้วย
แอตทริบิวต์ HTML:
  • <gmp-place-list selectable></gmp-place-list>
BetaaddEventListener
addEventListener(type, listener[, options])
พารามิเตอร์: 
  • typestring สตริงที่คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่ซึ่งแสดงถึงประเภทเหตุการณ์ที่จะรับฟัง
  • listenerEventListener|EventListenerObject ออบเจ็กต์ที่ได้รับการแจ้งเตือน ซึ่งต้องเป็นฟังก์ชันหรือออบเจ็กต์ที่มีเมธอด handleEvent
  • optionsboolean|AddEventListenerOptions optional ดูตัวเลือก เหตุการณ์ที่กำหนดเองรองรับเฉพาะ capture และ passive
ค่าที่ส่งคืน:  void
ตั้งค่าฟังก์ชันที่จะเรียกใช้เมื่อใดก็ตามที่มีการส่งเหตุการณ์ที่ระบุไปยังเป้าหมาย ดู addEventListener
configureFromSearchByTextRequest
configureFromSearchByTextRequest(request)
พารามิเตอร์: 
  • requestSearchByTextRequest คำขอให้แสดงผลลัพธ์ ไม่จำเป็นต้องระบุพร็อพเพอร์ตี้ fields ของ SearchByTextRequest
ค่าที่ส่งคืน:  Promise<void> สัญญาที่ได้รับการแก้ไขเมื่อโหลดและแสดงข้อมูลสถานที่แล้ว
กำหนดค่าวิดเจ็ตให้แสดงผลการค้นหาจากคำขอ Places Text Search API
configureFromSearchNearbyRequest
configureFromSearchNearbyRequest(request)
พารามิเตอร์: 
  • requestSearchNearbyRequest คำขอให้แสดงผลลัพธ์ ไม่จำเป็นต้องระบุพร็อพเพอร์ตี้ fields ของ SearchNearbyRequest
ค่าที่ส่งคืน:  Promise<void> สัญญาที่ได้รับการแก้ไขเมื่อโหลดและแสดงข้อมูลสถานที่แล้ว
กำหนดค่าวิดเจ็ตให้แสดงผลการค้นหาจากคำขอ Places Nearby Search API
BetaremoveEventListener
removeEventListener(type, listener[, options])
พารามิเตอร์: 
  • typestring สตริงที่ระบุประเภทของเหตุการณ์ที่จะนำเครื่องมือฟังเหตุการณ์ออก
  • listenerEventListener|EventListenerObject Listener เหตุการณ์ของตัวแฮนเดิลเหตุการณ์ที่จะนำออกจากเป้าหมายเหตุการณ์
  • optionsboolean|EventListenerOptions optional ดูตัวเลือก
ค่าที่ส่งคืน:  void
นำ Listener เหตุการณ์ที่ลงทะเบียนไว้ก่อนหน้านี้ด้วย addEventListener ออกจากเป้าหมาย ดู removeEventListener
gmp-load
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อองค์ประกอบโหลดและแสดงเนื้อหา เหตุการณ์นี้จะไม่ฟอง
gmp-placeselect
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อผู้ใช้เลือกสถานที่ มีออบเจ็กต์ Place และดัชนีของสถานที่ที่เลือกในรายการ
gmp-requesterror
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อคำขอไปยังแบ็กเอนด์ถูกปฏิเสธ (เช่น คีย์ API ไม่ถูกต้อง) เหตุการณ์นี้จะไม่ฟอง

PlaceListElementOptions อินเทอร์เฟซ

google.maps.places.PlaceListElementOptions อินเทอร์เฟซ

ตัวเลือกสำหรับ PlaceListElement

selectable optional
ประเภท:  boolean optional

PlaceListPlaceSelectEvent class

google.maps.places.PlaceListPlaceSelectEvent ชั้นเรียน

เหตุการณ์นี้จะปล่อยโดย PlaceListElement เมื่อผู้ใช้เลือกสถานที่

ชั้นเรียนนี้ขยายเวลา Event

เข้าถึงได้โดยโทรไปที่ const {PlaceListPlaceSelectEvent} = await google.maps.importLibrary("places")
ดูไลบรารีใน Maps JavaScript API

index
ประเภท:  number
ดัชนีรายการของสถานที่ที่เลือก
place
ประเภท:  Place
Place ออบเจ็กต์ที่มีรหัส สถานที่ตั้ง และวิวพอร์ตของสถานที่ที่เลือก

เติมข้อความอัตโนมัติ คลาส

google.maps.places.Autocomplete ชั้นเรียน

วิดเจ็ตที่แสดงการคาดคะเนสถานที่ตามข้อความที่ผู้ใช้ป้อน โดยจะแนบไปกับองค์ประกอบอินพุตประเภท text และรอรับการป้อนข้อความในช่องนั้น รายการการคาดคะเนจะแสดงเป็นรายการแบบเลื่อนลง และจะอัปเดตเมื่อมีการป้อนข้อความ

ชั้นเรียนนี้ขยายเวลา MVCObject

เข้าถึงได้โดยโทรไปที่ const {Autocomplete} = await google.maps.importLibrary("places")
ดูไลบรารีใน Maps JavaScript API

Autocomplete
Autocomplete(inputField[, opts])
พารามิเตอร์: 
  • inputFieldHTMLInputElement ช่องข้อความ <input> ที่ควรแนบ Autocomplete
  • optsAutocompleteOptions optional ตัวเลือก
สร้างอินสแตนซ์ใหม่ของ Autocomplete ที่แนบกับช่องข้อความอินพุตที่ระบุพร้อมตัวเลือกที่กำหนด
getBounds
getBounds()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  LatLngBounds|undefined ขอบเขตการเอนเอียง
แสดงขอบเขตที่การคาดการณ์มีแนวโน้ม
getFields
getFields()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  Array<string>|undefined
แสดงช่องที่จะรวมไว้สำหรับสถานที่ในการตอบกลับรายละเอียดเมื่อดึงข้อมูลรายละเอียดสำเร็จ ดูรายการช่องได้ที่ PlaceResult
getPlace
getPlace()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  PlaceResult สถานที่ที่ผู้ใช้เลือก
แสดงรายละเอียดของสถานที่ที่ผู้ใช้เลือก หากดึงข้อมูลรายละเอียดได้สำเร็จ ไม่เช่นนั้นจะแสดงผลออบเจ็กต์ Place ที่เป็น Stub โดยมีพร็อพเพอร์ตี้ name ตั้งค่าเป็นค่าปัจจุบันของช่องป้อนข้อมูล
setBounds
setBounds(bounds)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
กำหนดพื้นที่ที่ต้องการซึ่งจะแสดงผลลัพธ์ของสถานที่ ผลลัพธ์จะเอนเอียงไปทางด้านนี้ แต่ไม่ได้จำกัดอยู่เพียงด้านนี้
setComponentRestrictions
setComponentRestrictions(restrictions)
พารามิเตอร์: 
  • restrictionsComponentRestrictions optional ข้อจำกัดในการใช้งาน
ค่าที่ส่งคืน: ไม่มี
ตั้งค่าข้อจำกัดของคอมโพเนนต์ ข้อจำกัดของคอมโพเนนต์ใช้เพื่อจำกัดการคาดการณ์ให้เฉพาะภายในคอมโพเนนต์หลัก เช่น ประเทศ
setFields
setFields(fields)
พารามิเตอร์: 
  • fieldsArray<string> optional
ค่าที่ส่งคืน: ไม่มี
กำหนดช่องที่จะรวมไว้สำหรับสถานที่ในการตอบกลับรายละเอียดเมื่อดึงข้อมูลรายละเอียดสำเร็จ ดูรายการช่องได้ที่ PlaceResult
setOptions
setOptions(options)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
setTypes
setTypes(types)
พารามิเตอร์: 
  • typesArray<string> optional ประเภทของการคาดคะเนที่จะรวม
ค่าที่ส่งคืน: ไม่มี
ตั้งค่าประเภทการคาดการณ์ที่จะแสดง ดูประเภทที่รองรับได้ใน คู่มือสำหรับนักพัฒนาซอฟต์แวร์ หากไม่ได้ระบุประเภท ระบบจะแสดงผลประเภททั้งหมด
สืบทอด: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
place_changed
function()
อาร์กิวเมนต์: ไม่มี
ระบบจะทริกเกอร์เหตุการณ์นี้เมื่อมี PlaceResult สำหรับสถานที่ที่ผู้ใช้เลือก
หากผู้ใช้ป้อนชื่อสถานที่ที่ตัวควบคุมไม่ได้แนะนำและกดแป้น Enter หรือหากคำขอรายละเอียดสถานที่ล้มเหลว 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
กำหนดว่าจะดึงข้อมูลเฉพาะรหัสสถานที่หรือไม่ PlaceResult ที่พร้อมใช้งานเมื่อทริกเกอร์เหตุการณ์ place_changed จะมีเฉพาะฟิลด์ place_id, types และ name โดยมี place_id, types และ 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
พื้นที่ที่จะใช้เพื่อเอนเอียงการคาดการณ์การค้นหา การคาดการณ์จะเอนเอียงไปทางคำค้นหาที่กำหนดขอบเขตเหล่านี้ แต่ไม่ได้จำกัดอยู่เพียงคำค้นหาดังกล่าว