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)พารามิเตอร์:
|
พร็อพเพอร์ตี้ | |
|---|---|
|
ประเภท:
Array<string> optionalประเภทสถานที่หลักที่รวมไว้ (เช่น "restaurant" หรือ "gas_station")
ระบบจะแสดงสถานที่ก็ต่อเมื่อประเภทหลักของสถานที่นั้นรวมอยู่ในรายการนี้ โดยระบุได้สูงสุด 5 ค่า หากไม่ได้ระบุประเภท ระบบจะแสดงผลสถานที่ทุกประเภท แอตทริบิวต์ HTML:
|
|
ประเภท:
Array<string> optionalรวมเฉพาะผลการค้นหาในภูมิภาคที่ระบุ โดยระบุเป็นรหัสภูมิภาค 2 อักขระของ CLDR ได้สูงสุด 15 รายการ ชุดข้อมูลที่ว่างเปล่าจะไม่จำกัดผลลัพธ์ หากตั้งค่าทั้ง
locationRestriction และ includedRegionCodes ผลลัพธ์จะอยู่ในพื้นที่ที่ทับซ้อนกันแอตทริบิวต์ HTML:
|
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:
|
|
ประเภท:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalต้นทางที่จะคำนวณระยะทาง หากไม่ได้ระบุ ระบบจะไม่คำนวณระยะทาง ระบบจะไม่ใช้ระดับความสูงในการคำนวณหากมีการระบุ
แอตทริบิวต์ HTML:
|
requestedLanguage |
ประเภท:
string optionalตัวระบุภาษาสำหรับภาษาที่ควรแสดงผลลัพธ์ (หากเป็นไปได้) ผลการค้นหาในภาษาที่เลือกอาจได้รับการจัดอันดับสูงขึ้น แต่คำแนะนำไม่ได้จำกัดอยู่แค่ในภาษานี้ ดูรายการภาษาที่รองรับ
แอตทริบิวต์ HTML:
|
requestedRegion |
ประเภท:
string optionalรหัสภูมิภาคที่ใช้สำหรับการจัดรูปแบบผลลัพธ์และการกรองผลลัพธ์ แต่ไม่ได้จำกัดการแนะนำไว้เฉพาะในประเทศนี้ รหัสภูมิภาคยอมรับค่า ccTLD ("โดเมนระดับบนสุด") ที่มีอักขระ 2 ตัว รหัส ccTLD ส่วนใหญ่จะเหมือนกับรหัส ISO 3166-1 แต่ก็มีข้อยกเว้นที่สำคัญบางประการ เช่น ccTLD ของสหราชอาณาจักรคือ "uk" (
.co.uk) ขณะที่รหัส ISO 3166-1 คือ "gb" (ในทางเทคนิคสำหรับนิติบุคคล "สหราชอาณาจักรบริเตนใหญ่และไอร์แลนด์เหนือ")แอตทริบิวต์ HTML:
|
|
ประเภท:
UnitSystem optionalระบบหน่วยที่ใช้เพื่อแสดงระยะทาง หากไม่ได้ระบุ ระบบจะกำหนดระบบหน่วยตาม requestedRegion
แอตทริบิวต์ HTML:
|
|
ประเภท:
ComponentRestrictions optionalข้อจำกัดของคอมโพเนนต์ ข้อจำกัดของคอมโพเนนต์ใช้เพื่อจำกัดการคาดการณ์ให้เฉพาะภายในคอมโพเนนต์หลัก เช่น ประเทศ |
|
ประเภท:
Array<string> optionalประเภทของการคาดการณ์ที่จะแสดง ดูประเภทที่รองรับได้ใน คู่มือสำหรับนักพัฒนาซอฟต์แวร์ หากไม่ได้ระบุประเภท ระบบจะแสดงผลประเภททั้งหมด
แอตทริบิวต์ HTML:
|
ชิ้นส่วน | |
|---|---|
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 |
เมธอด | |
|---|---|
|
addEventListener(type, listener[, options])พารามิเตอร์:
ค่าที่ส่งคืน:
voidตั้งค่าฟังก์ชันที่จะเรียกใช้เมื่อใดก็ตามที่มีการส่งเหตุการณ์ที่ระบุไปยังเป้าหมาย ดู addEventListener |
|
removeEventListener(type, listener[, options])พารามิเตอร์:
ค่าที่ส่งคืน:
voidนำ Listener เหตุการณ์ที่ลงทะเบียนไว้ก่อนหน้านี้ด้วย addEventListener ออกจากเป้าหมาย ดู removeEventListener |
กิจกรรม | |
|---|---|
gmp-error |
function(errorEvent)อาร์กิวเมนต์:
เหตุการณ์นี้จะเริ่มทำงานเมื่อคำขอไปยังแบ็กเอนด์ถูกปฏิเสธ (เช่น คีย์ API ไม่ถูกต้อง) เหตุการณ์นี้จะไม่ฟอง |
gmp-select |
function(placePredictionSelectEvent)อาร์กิวเมนต์:
เหตุการณ์นี้จะทริกเกอร์เมื่อผู้ใช้เลือกการคาดคะเนสถานที่ มีออบเจ็กต์ PlacePrediction ซึ่งแปลงเป็นออบเจ็กต์ Place ได้ |
|
function(placeAutocompletePlaceSelectEvent)อาร์กิวเมนต์:
เหตุการณ์นี้จะทริกเกอร์เมื่อผู้ใช้เลือกการคาดคะเนสถานที่ มีออบเจ็กต์สถานที่ |
PlaceAutocompleteElementOptions อินเทอร์เฟซ
google.maps.places.PlaceAutocompleteElementOptions
อินเทอร์เฟซ
ตัวเลือกสำหรับการสร้าง PlaceAutocompleteElement ดูคำอธิบายของแต่ละพร็อพเพอร์ตี้ได้ในพร็อพเพอร์ตี้ที่มีชื่อเดียวกันในคลาส PlaceAutocompleteElement
พร็อพเพอร์ตี้ | |
|---|---|
|
ประเภท:
ComponentRestrictions optional |
|
ประเภท:
Array<string> optional |
|
ประเภท:
Array<string> optional |
locationBias optional |
ประเภท:
LocationBias optional |
locationRestriction optional |
ประเภท:
LocationRestriction optional |
name optional |
ประเภท:
string optional |
|
ประเภท:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional |
requestedLanguage optional |
ประเภท:
string optional |
|
ประเภท:
Array<string> optional |
|
ประเภท:
UnitSystem optional |
PlaceAutocompletePlaceSelectEvent class
google.maps.places.PlaceAutocompletePlaceSelectEvent
ชั้นเรียน
เหตุการณ์นี้จะสร้างขึ้นหลังจากที่ผู้ใช้เลือกสถานที่ด้วยองค์ประกอบ Place Autocomplete เข้าถึงการเลือกด้วย event.place
ชั้นเรียนนี้ขยายเวลา
Event
เข้าถึงได้โดยโทรไปที่ const {PlaceAutocompletePlaceSelectEvent} = await google.maps.importLibrary("places")
ดูไลบรารีใน Maps JavaScript API
พร็อพเพอร์ตี้ | |
|---|---|
|
ประเภท:
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:
|
เมธอด | |
|---|---|
|
addEventListener(type, listener[, options])พารามิเตอร์:
ค่าที่ส่งคืน:
voidตั้งค่าฟังก์ชันที่จะเรียกใช้เมื่อใดก็ตามที่มีการส่งเหตุการณ์ที่ระบุไปยังเป้าหมาย ดู addEventListener |
configureFromLocation |
configureFromLocation(location)พารามิเตอร์:
ค่าที่ส่งคืน:
Promise<void> สัญญาที่ได้รับการแก้ไขเมื่อโหลดและแสดงข้อมูลสถานที่แล้วกำหนดค่าวิดเจ็ตจาก LatLng โดยใช้การเข้ารหัสพิกัดภูมิศาสตร์แบบย้อนกลับ |
configureFromPlace |
configureFromPlace(place)พารามิเตอร์:
ค่าที่ส่งคืน:
Promise<void> สัญญาที่ได้รับการแก้ไขเมื่อโหลดและแสดงข้อมูลสถานที่แล้วกำหนดค่าวิดเจ็ตจากออบเจ็กต์ Place หรือรหัสสถานที่ |
|
removeEventListener(type, listener[, options])พารามิเตอร์:
ค่าที่ส่งคืน:
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 |
อ่านอย่างเดียว อาร์เรย์ของออบเจ็กต์ Place ที่มีรหัส ตำแหน่ง และวิวพอร์ตของสถานที่ที่แสดงผลในปัจจุบัน |
selectable |
ประเภท:
booleanรายการในลิสต์เลือกได้หรือไม่ หากเป็นจริง รายการจะกลายเป็นปุ่มที่ส่งเหตุการณ์
gmp-placeselect เมื่อคลิก นอกจากนี้ยังรองรับการไปยังส่วนต่างๆ และการเลือกด้วยแป้นพิมพ์ที่เข้าถึงได้ด้วยแอตทริบิวต์ HTML:
|
เมธอด | |
|---|---|
|
addEventListener(type, listener[, options])พารามิเตอร์:
ค่าที่ส่งคืน:
voidตั้งค่าฟังก์ชันที่จะเรียกใช้เมื่อใดก็ตามที่มีการส่งเหตุการณ์ที่ระบุไปยังเป้าหมาย ดู addEventListener |
configureFromSearchByTextRequest |
configureFromSearchByTextRequest(request)พารามิเตอร์:
ค่าที่ส่งคืน:
Promise<void> สัญญาที่ได้รับการแก้ไขเมื่อโหลดและแสดงข้อมูลสถานที่แล้วกำหนดค่าวิดเจ็ตให้แสดงผลการค้นหาจากคำขอ Places Text Search API |
configureFromSearchNearbyRequest |
configureFromSearchNearbyRequest(request)พารามิเตอร์:
ค่าที่ส่งคืน:
Promise<void> สัญญาที่ได้รับการแก้ไขเมื่อโหลดและแสดงข้อมูลสถานที่แล้วกำหนดค่าวิดเจ็ตให้แสดงผลการค้นหาจากคำขอ Places Nearby Search API |
|
removeEventListener(type, listener[, options])พารามิเตอร์:
ค่าที่ส่งคืน:
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 |
ประเภท:
PlacePlace ออบเจ็กต์ที่มีรหัส สถานที่ตั้ง และวิวพอร์ตของสถานที่ที่เลือก |
เติมข้อความอัตโนมัติ คลาส
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 สถานที่ที่ผู้ใช้เลือกแสดงรายละเอียดของสถานที่ที่ผู้ใช้เลือก หากดึงข้อมูลรายละเอียดได้สำเร็จ ไม่เช่นนั้นจะแสดงผลออบเจ็กต์ Place ที่เป็น Stub โดยมีพร็อพเพอร์ตี้ name ตั้งค่าเป็นค่าปัจจุบันของช่องป้อนข้อมูล |
setBounds |
setBounds(bounds)พารามิเตอร์:
ค่าที่ส่งคืน: ไม่มี
กำหนดพื้นที่ที่ต้องการซึ่งจะแสดงผลลัพธ์ของสถานที่ ผลลัพธ์จะเอนเอียงไปทางด้านนี้ แต่ไม่ได้จำกัดอยู่เพียงด้านนี้ |
setComponentRestrictions |
setComponentRestrictions(restrictions)พารามิเตอร์:
ค่าที่ส่งคืน: ไม่มี
ตั้งค่าข้อจำกัดของคอมโพเนนต์ ข้อจำกัดของคอมโพเนนต์ใช้เพื่อจำกัดการคาดการณ์ให้เฉพาะภายในคอมโพเนนต์หลัก เช่น ประเทศ |
setFields |
setFields(fields)พารามิเตอร์:
ค่าที่ส่งคืน: ไม่มี
กำหนดช่องที่จะรวมไว้สำหรับสถานที่ในการตอบกลับรายละเอียดเมื่อดึงข้อมูลรายละเอียดสำเร็จ ดูรายการช่องได้ที่ PlaceResult |
setOptions |
setOptions(options)พารามิเตอร์:
ค่าที่ส่งคืน: ไม่มี
|
setTypes |
setTypes(types)พารามิเตอร์:
ค่าที่ส่งคืน: ไม่มี
ตั้งค่าประเภทการคาดการณ์ที่จะแสดง ดูประเภทที่รองรับได้ใน คู่มือสำหรับนักพัฒนาซอฟต์แวร์ หากไม่ได้ระบุประเภท ระบบจะแสดงผลประเภททั้งหมด |
สืบทอด:
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'] |
|
ประเภท:
boolean optionalกำหนดว่าจะดึงข้อมูลเฉพาะรหัสสถานที่หรือไม่ PlaceResult ที่พร้อมใช้งานเมื่อทริกเกอร์เหตุการณ์ place_changed จะมีเฉพาะฟิลด์ place_id, types และ name โดยมี place_id, types และ description ที่บริการเติมข้อความอัตโนมัติแสดง ปิดใช้โดยค่าเริ่มต้น |
strictBounds optional |
ประเภท:
boolean optionalค่าบูลีนที่ระบุว่าวิดเจ็ตการเติมข้อความอัตโนมัติควรแสดงเฉพาะสถานที่ที่อยู่ภายในขอบเขตของวิดเจ็ตการเติมข้อความอัตโนมัติ ณ เวลาที่ส่งคำค้นหา การตั้งค่า strictBounds เป็น false (ซึ่งเป็นค่าเริ่มต้น) จะทำให้ผลการค้นหามีแนวโน้มที่จะเป็นสถานที่ที่อยู่ในขอบเขต แต่จะไม่จำกัดเฉพาะสถานที่เหล่านั้น |
types optional |
ประเภท:
Array<string> optionalประเภทของการคาดการณ์ที่จะแสดง ดูประเภทที่รองรับได้ใน คู่มือสำหรับนักพัฒนาซอฟต์แวร์ หากไม่ได้ระบุประเภท ระบบจะแสดงผลประเภททั้งหมด |
SearchBox class
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พื้นที่ที่จะใช้เพื่อเอนเอียงการคาดการณ์การค้นหา การคาดการณ์จะเอนเอียงไปทางคำค้นหาที่กำหนดขอบเขตเหล่านี้ แต่ไม่ได้จำกัดอยู่เพียงคำค้นหาดังกล่าว |