Place Widget Content Customization

คลาส PlaceContentConfigElement

class google.maps.places.PlaceContentConfigElement extends HTMLElement implements PlaceContentConfigElementOptions
library "places"

กำหนดค่า PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement เพื่อแสดงชุดเนื้อหาที่กำหนดเอง เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยเพื่อใช้งาน

สำหรับ PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement ให้เพิ่มองค์ประกอบต่อไปนี้ต่อท้าย PlaceContentConfigElement เพื่อแสดงเนื้อหาที่เกี่ยวข้อง
PlaceAddressElement, PlaceAccessibleEntranceIconElement, PlaceAttributionElement PlaceMediaElement, PlaceOpenNowStatusElement, PlacePriceElement, PlaceRatingElement, PlaceTypeElement

สำหรับ PlaceDetailsElement โดยเฉพาะ คุณยังสามารถเพิ่มองค์ประกอบต่อไปนี้ได้ด้วย
PlaceFeatureListElement PlaceOpeningHoursElement, PlacePhoneNumberElement, PlacePlusCodeElement, PlaceReviewSummaryElement, PlaceReviewsElement, PlaceSummaryElement, PlaceTypeSpecificHighlightsElement, PlaceWebsiteElement

ลำดับขององค์ประกอบย่อยไม่มีความสำคัญ องค์ประกอบจะแสดงผลเนื้อหาตามลำดับมาตรฐานซึ่งปรับแต่งไม่ได้ ตัวอย่าง

 <gmp-place-details>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
     <gmp-place-address></gmp-place-address>
   </gmp-place-content-config>
 </gmp-place-details> 

<gmp-place-content-config></gmp-place-content-config>

const {PlaceContentConfigElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlaceContentConfigElement	PlaceContentConfigElement([options]) พารามิเตอร์ options: PlaceContentConfigElementOptions optional

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceContentConfigElementOptions
ติดตั้งใช้งานโดย PlaceContentConfigElement

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

คลาส PlaceAllContentElement

class google.maps.places.PlaceAllContentElement extends HTMLElement implements PlaceAllContentElementOptions
library "places"

กำหนดค่า PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement เพื่อแสดงเนื้อหาทั้งหมดที่มี เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยเพื่อใช้งาน เช่น

 <gmp-place-details>
   <gmp-place-all-content></gmp-place-all-content>
 </gmp-place-details>
 

<gmp-place-all-content></gmp-place-all-content>

const {PlaceAllContentElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlaceAllContentElement	PlaceAllContentElement([options]) พารามิเตอร์ options: PlaceAllContentElementOptions optional

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceAllContentElementOptions
ติดตั้งใช้งานโดย PlaceAllContentElement

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

คลาส PlaceStandardContentElement

class google.maps.places.PlaceStandardContentElement extends HTMLElement implements PlaceStandardContentElementOptions
library "places"

กำหนดค่า PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement เพื่อแสดงชุดเนื้อหามาตรฐาน เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยเพื่อใช้งาน
สำหรับ PlaceDetailsElement เนื้อหามาตรฐานประกอบด้วยสิ่งต่อไปนี้

• สื่อ
• ที่อยู่
• คะแนน
• ประเภท
• ราคา
• ไอคอนทางเข้าที่รองรับเก้าอี้รถเข็น
• เว็บไซต์
• หมายเลขโทรศัพท์
• เวลาทำการ
• สรุป
• ไฮไลต์เฉพาะประเภท
• รีวิว
• รายการฟีเจอร์

สำหรับ PlaceDetailsCompactElement เนื้อหามาตรฐานประกอบด้วย

• สื่อ
• คะแนน
• ประเภท
• ราคา
• ไอคอนทางเข้าที่รองรับเก้าอี้รถเข็น
• สถานะเปิดอยู่

สำหรับ PlaceSearchElement เนื้อหามาตรฐานประกอบด้วย

• สื่อ
• คะแนน
• ประเภท
• ราคา
• ไอคอนทางเข้าที่รองรับเก้าอี้รถเข็น

ตัวอย่างเช่น

 <gmp-place-details>
   <gmp-place-standard-content></gmp-place-standard-content>
 </gmp-place-details>
 

<gmp-place-standard-content></gmp-place-standard-content>

const {PlaceStandardContentElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlaceStandardContentElement	PlaceStandardContentElement([options]) พารามิเตอร์ options: PlaceStandardContentElementOptions optional

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceStandardContentElementOptions
ติดตั้งใช้งานโดย PlaceStandardContentElement

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

คลาส PlaceMediaElement

class google.maps.places.PlaceMediaElement extends HTMLElement implements PlaceMediaElementOptions
library "places"

กำหนดค่า PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement เพื่อแสดงสื่อของสถานที่ เช่น รูปภาพ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-media lightbox-preferred></gmp-place-media>
 </gmp-place-content-config>
 

<gmp-place-media
  lightbox-preferred
  preferred-size="value-name">
</gmp-place-media>

const {PlaceMediaElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlaceMediaElement	PlaceMediaElement([options]) พารามิเตอร์ options: PlaceMediaElementOptions optional

พร็อพเพอร์ตี้
lightboxPreferred attr: lightbox-preferred	ประเภทอินพุต: boolean optional ประเภทเอาต์พุต: boolean ค่าเริ่มต้น: false เปิดหรือปิดใช้ไลท์บ็อกซ์สื่อ ในกรณีที่รองรับทั้ง 2 ตัวเลือก แอตทริบิวต์ HTML: lightbox-preferred
preferredSize attr: preferred-size	ประเภทอินพุต: MediaSize optional ประเภทเอาต์พุต: MediaSize optional ค่าเริ่มต้น: null ขนาดสื่อที่ต้องการในกรณีที่รองรับหลายขนาด เช่น PlaceSearchElement แนวตั้ง หมวดหมู่ PlaceSearchElement จะใช้ MediaSize.SMALL โดยค่าเริ่มต้นหากไม่ได้ระบุไว้ แอตทริบิวต์ HTML: preferred-size="value-name"

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceMediaElementOptions
ติดตั้งใช้งานโดย PlaceMediaElement

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

พร็อพเพอร์ตี้
lightboxPreferred ไม่บังคับ	ประเภท: boolean optional ดูPlaceMediaElement.lightboxPreferred
preferredSize ไม่บังคับ	ประเภท: MediaSize optional ดูPlaceMediaElement.preferredSize

MediaSize ค่าคงที่

constants google.maps.places.MediaSize
library "places"

ขนาดสื่อที่ต้องการในกรณีที่รองรับหลายขนาด เช่น PlaceSearchElement แนวตั้ง

ค่าคงที่เหล่านี้ยังใช้เป็นสตริงได้ด้วย ใน TypeScript สตริงลิเทอรัลจะกำหนดโดยประเภท MediaSizeString

const {MediaSize} = await google.maps.importLibrary("places");

ค่าคงที่
LARGE	สื่อมีขนาดใหญ่
MEDIUM	ขนาดสื่อปานกลาง
SMALL	สื่อขนาดเล็ก

คลาส PlaceAddressElement

class google.maps.places.PlaceAddressElement extends HTMLElement implements PlaceAddressElementOptions
library "places"

กำหนดค่า PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement เพื่อแสดงที่อยู่ของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-address></gmp-place-address>
 </gmp-place-content-config>
 

<gmp-place-address></gmp-place-address>

const {PlaceAddressElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlaceAddressElement	PlaceAddressElement([options]) พารามิเตอร์ options: PlaceAddressElementOptions optional

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceAddressElementOptions
ติดตั้งใช้งานโดย PlaceAddressElement

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

คลาส PlaceRatingElement

class google.maps.places.PlaceRatingElement extends HTMLElement implements PlaceRatingElementOptions
library "places"

กำหนดค่า PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement เพื่อแสดงคะแนนของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-rating></gmp-place-rating>
 </gmp-place-content-config>
 

<gmp-place-rating></gmp-place-rating>

const {PlaceRatingElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlaceRatingElement	PlaceRatingElement([options]) พารามิเตอร์ options: PlaceRatingElementOptions optional

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceRatingElementOptions
ติดตั้งใช้งานโดย PlaceRatingElement

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

คลาส PlaceTypeElement

class google.maps.places.PlaceTypeElement extends HTMLElement implements PlaceTypeElementOptions
library "places"

กำหนดค่า PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement เพื่อแสดงประเภทของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-type></gmp-place-type>
 </gmp-place-content-config>
 

<gmp-place-type></gmp-place-type>

const {PlaceTypeElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlaceTypeElement	PlaceTypeElement([options]) พารามิเตอร์ options: PlaceTypeElementOptions optional

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceTypeElementOptions
ติดตั้งใช้งานโดย PlaceTypeElement

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

คลาส PlacePriceElement

class google.maps.places.PlacePriceElement extends HTMLElement implements PlacePriceElementOptions
library "places"

กำหนดค่า PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement เพื่อแสดงระดับราคาหรือช่วงราคาของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-price></gmp-place-price>
 </gmp-place-content-config>
 

<gmp-place-price></gmp-place-price>

const {PlacePriceElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlacePriceElement	PlacePriceElement([options]) พารามิเตอร์ options: PlacePriceElementOptions optional

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlacePriceElementOptions
ติดตั้งใช้งานโดย PlacePriceElement

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

คลาส PlaceAccessibleEntranceIconElement

class google.maps.places.PlaceAccessibleEntranceIconElement extends HTMLElement implements PlaceAccessibleEntranceIconElementOptions
library "places"

กำหนดค่า PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement ให้แสดงไอคอนเก้าอี้รถเข็นหากสถานที่นั้นมีทางเข้าที่รองรับเก้าอี้รถเข็น เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-accessible-entrance-icon></gmp-place-accessible-entrance-icon>
 </gmp-place-content-config>
 

<gmp-place-accessible-entrance-icon></gmp-place-accessible-entrance-icon>

const {PlaceAccessibleEntranceIconElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlaceAccessibleEntranceIconElement	PlaceAccessibleEntranceIconElement([options]) พารามิเตอร์ options: PlaceAccessibleEntranceIconElementOptions optional

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceAccessibleEntranceIconElementOptions
ติดตั้งใช้งานโดย PlaceAccessibleEntranceIconElement

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

คลาส PlaceOpenNowStatusElement

class google.maps.places.PlaceOpenNowStatusElement extends HTMLElement implements PlaceOpenNowStatusElementOptions
library "places"

กำหนดค่า PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement เพื่อแสดงสถานะเปิดหรือปิดปัจจุบันของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-open-now-status></gmp-place-open-now-status>
 </gmp-place-content-config>
 

<gmp-place-open-now-status></gmp-place-open-now-status>

const {PlaceOpenNowStatusElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlaceOpenNowStatusElement	PlaceOpenNowStatusElement([options]) พารามิเตอร์ options: PlaceOpenNowStatusElementOptions optional

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceOpenNowStatusElementOptions
ติดตั้งใช้งานโดย PlaceOpenNowStatusElement

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

คลาส PlaceReviewSummaryElement

class google.maps.places.PlaceReviewSummaryElement extends HTMLElement implements PlaceReviewSummaryElementOptions
library "places"

กำหนดค่า PlaceDetailsElement เพื่อแสดงสรุปรีวิวของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-review-summary></gmp-place-review-summary>
 </gmp-place-content-config>
 

<gmp-place-review-summary></gmp-place-review-summary>

const {PlaceReviewSummaryElement} = await google.maps.importLibrary("places");

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceReviewSummaryElementOptions
ติดตั้งใช้งานโดย PlaceReviewSummaryElement

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

คลาส PlaceReviewsElement

class google.maps.places.PlaceReviewsElement extends HTMLElement implements PlaceReviewsElementOptions
library "places"

กำหนดค่า PlaceDetailsElement เพื่อแสดงรีวิวของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-reviews></gmp-place-reviews>
 </gmp-place-content-config>
 

<gmp-place-reviews></gmp-place-reviews>

const {PlaceReviewsElement} = await google.maps.importLibrary("places");

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceReviewsElementOptions
ติดตั้งใช้งานโดย PlaceReviewsElement

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

คลาส PlaceSummaryElement

class google.maps.places.PlaceSummaryElement extends HTMLElement implements PlaceSummaryElementOptions
library "places"

กำหนดค่า PlaceDetailsElement เพื่อแสดงข้อมูลสรุปของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-summary></gmp-place-summary>
 </gmp-place-content-config>
 

<gmp-place-summary></gmp-place-summary>

const {PlaceSummaryElement} = await google.maps.importLibrary("places");

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceSummaryElementOptions
ติดตั้งใช้งานโดย PlaceSummaryElement

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

คลาส PlaceFeatureListElement

class google.maps.places.PlaceFeatureListElement extends HTMLElement implements PlaceFeatureListElementOptions
library "places"

กำหนดค่า PlaceDetailsElement เพื่อแสดงรายการฟีเจอร์ของสถานที่ในแท็บ "เกี่ยวกับ" รายการฟีเจอร์อาจรวมถึงตัวเลือกการช่วยเหลือพิเศษ สิ่งอำนวยความสะดวก วิธีการชำระเงินที่ยอมรับ และอื่นๆ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-feature-list></gmp-place-feature-list>
 </gmp-place-content-config>
 

<gmp-place-feature-list></gmp-place-feature-list>

const {PlaceFeatureListElement} = await google.maps.importLibrary("places");

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceFeatureListElementOptions
ติดตั้งใช้งานโดย PlaceFeatureListElement

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

คลาส PlaceOpeningHoursElement

class google.maps.places.PlaceOpeningHoursElement extends HTMLElement implements PlaceOpeningHoursElementOptions
library "places"

กำหนดค่า PlaceDetailsElement เพื่อแสดงเวลาทำการของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-opening-hours></gmp-place-opening-hours>
 </gmp-place-content-config>
 

<gmp-place-opening-hours></gmp-place-opening-hours>

const {PlaceOpeningHoursElement} = await google.maps.importLibrary("places");

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceOpeningHoursElementOptions
ติดตั้งใช้งานโดย PlaceOpeningHoursElement

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

คลาส PlacePhoneNumberElement

class google.maps.places.PlacePhoneNumberElement extends HTMLElement implements PlacePhoneNumberElementOptions
library "places"

กำหนดค่า PlaceDetailsElement เพื่อแสดงหมายเลขโทรศัพท์ของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-phone-number></gmp-place-phone-number>
 </gmp-place-content-config>
 

<gmp-place-phone-number></gmp-place-phone-number>

const {PlacePhoneNumberElement} = await google.maps.importLibrary("places");

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlacePhoneNumberElementOptions
ติดตั้งใช้งานโดย PlacePhoneNumberElement

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

คลาส PlacePlusCodeElement

class google.maps.places.PlacePlusCodeElement extends HTMLElement implements PlacePlusCodeElementOptions
library "places"

กำหนดค่า PlaceDetailsElement เพื่อแสดง Plus Code ของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-plus-code></gmp-place-plus-code>
 </gmp-place-content-config>
 

<gmp-place-plus-code></gmp-place-plus-code>

const {PlacePlusCodeElement} = await google.maps.importLibrary("places");

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlacePlusCodeElementOptions
ติดตั้งใช้งานโดย PlacePlusCodeElement

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

คลาส PlaceTypeSpecificHighlightsElement

class google.maps.places.PlaceTypeSpecificHighlightsElement extends HTMLElement implements PlaceTypeSpecificHighlightsElementOptions
library "places"

กำหนดค่า PlaceDetailsElement เพื่อแสดงไฮไลต์เฉพาะประเภทของสถานที่ เช่น ราคาน้ำมันและความพร้อมใช้งานของที่ชาร์จ EV เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-type-specific-highlights></gmp-place-type-specific-highlights>
 </gmp-place-content-config>
 

<gmp-place-type-specific-highlights></gmp-place-type-specific-highlights>

const {PlaceTypeSpecificHighlightsElement} = await google.maps.importLibrary("places");

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceTypeSpecificHighlightsElementOptions
ติดตั้งใช้งานโดย PlaceTypeSpecificHighlightsElement

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

คลาส PlaceWebsiteElement

class google.maps.places.PlaceWebsiteElement extends HTMLElement implements PlaceWebsiteElementOptions
library "places"

กำหนดค่า PlaceDetailsElement เพื่อแสดงเว็บไซต์ของสถานที่ เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน เช่น

 <gmp-place-content-config>
   <gmp-place-website></gmp-place-website>
 </gmp-place-content-config>
 

<gmp-place-website></gmp-place-website>

const {PlaceWebsiteElement} = await google.maps.importLibrary("places");

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceWebsiteElementOptions
ติดตั้งใช้งานโดย PlaceWebsiteElement

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

คลาส PlaceAttributionElement

class google.maps.places.PlaceAttributionElement extends HTMLElement implements PlaceAttributionElementOptions
library "places"

อนุญาตให้ปรับแต่งข้อความแสดงแหล่งที่มาของ Google Maps ใน PlaceDetailsCompactElement, PlaceDetailsElement หรือ PlaceSearchElement เพิ่มองค์ประกอบนี้เป็นองค์ประกอบย่อยของ PlaceContentConfigElement เพื่อใช้งาน หากละเว้นองค์ประกอบนี้ การระบุแหล่งที่มาจะยังคงแสดงด้วยสีเริ่มต้น เช่น

 <gmp-place-content-config>
   <gmp-place-attribution
      light-scheme-color="black"
      dark-scheme-color="white"
   ></gmp-place-attribution>
 </gmp-place-content-config>
 

<gmp-place-attribution
  dark-scheme-color="value-name"
  light-scheme-color="value-name">
</gmp-place-attribution>

const {PlaceAttributionElement} = await google.maps.importLibrary("places");

ผู้ผลิต
PlaceAttributionElement	PlaceAttributionElement([options]) พารามิเตอร์ options: PlaceAttributionElementOptions optional

พร็อพเพอร์ตี้
darkSchemeColor attr: dark-scheme-color	ประเภทอินพุต: AttributionColor optional ประเภทเอาต์พุต: AttributionColor ค่าเริ่มต้น: AttributionColor.WHITE สีของการระบุแหล่งที่มาของ Google Maps ในโหมดมืด แอตทริบิวต์ HTML: dark-scheme-color="value-name"
lightSchemeColor attr: light-scheme-color	ประเภทอินพุต: AttributionColor optional ประเภทเอาต์พุต: AttributionColor ค่าเริ่มต้น: AttributionColor.GRAY สีของการระบุแหล่งที่มาของ Google Maps ในโหมดสว่าง แอตทริบิวต์ HTML: light-scheme-color="value-name"

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceAttributionElementOptions
ติดตั้งใช้งานโดย PlaceAttributionElement

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

พร็อพเพอร์ตี้
darkSchemeColor ไม่บังคับ	ประเภท: AttributionColor optional ดูPlaceAttributionElement.darkSchemeColor
lightSchemeColor ไม่บังคับ	ประเภท: AttributionColor optional ดูPlaceAttributionElement.lightSchemeColor

AttributionColor ค่าคงที่

constants google.maps.places.AttributionColor
library "places"

ตัวเลือกสีสำหรับข้อความแสดงแหล่งที่มาของ Google Maps คุณสามารถปรับแต่งการระบุแหล่งที่มาให้ใช้สีใดก็ได้เหล่านี้

ค่าคงที่เหล่านี้ยังใช้เป็นสตริงได้ด้วย ใน TypeScript สตริงลิเทอรัลจะกำหนดโดยประเภท AttributionColorString

const {AttributionColor} = await google.maps.importLibrary("places");

ค่าคงที่
BLACK	ข้อความแสดงแหล่งที่มาสีดำ
GRAY	ข้อความแสดงแหล่งที่มาสีเทา
WHITE	ข้อความแสดงแหล่งที่มาสีขาว

คลาส PlaceButtonElement

class google.maps.places.PlaceButtonElement extends HTMLElement implements PlaceButtonElementOptions
library "places"

ประกาศ: ใช้ได้เฉพาะในเวอร์ชันเบต้าเท่านั้น

แสดงปุ่มที่อยู่ในช่อง action-main หรือช่อง action-corner PlaceButtonElement ไม่มีลักษณะการทำงานเริ่มต้น แนบ Listener เหตุการณ์กับองค์ประกอบเพื่อกำหนดลักษณะการทำงาน โดยค่าเริ่มต้น ปุ่มจะแสดงในช่อง action-main

<gmp-place-button
  action-aria-label="string"
  label="string">
</gmp-place-button>

const {PlaceButtonElement} = await google.maps.importLibrary("places");

พร็อพเพอร์ตี้
actionAriaLabel attr: action-aria-label	ประเภท: string optional ค่าเริ่มต้น: undefined ป้ายกำกับ ARIA สำหรับการควบคุมภายใน การควบคุมที่มีเฉพาะไอคอนควรมี aria-label เสมอเพื่ออธิบายวัตถุประสงค์และลักษณะการทำงาน ตัวควบคุมที่แสดงผลในมุมจะไม่แสดงป้ายกำกับ ดังนั้นเราขอแนะนำให้ใช้ aria-label แทนป้ายกำกับสำหรับตัวควบคุมมุม แอตทริบิวต์ HTML: action-aria-label="string"
label attr: label	ประเภท: string optional ค่าเริ่มต้น: undefined ป้ายกำกับที่จะแสดงในการควบคุม ระบบจะละเว้นแอตทริบิวต์นี้สำหรับลิงก์ที่มีประเภทการดำเนินการที่กำหนดไว้ล่วงหน้า ลิงก์และปุ่มที่แสดงผลในช่องมุมการดำเนินการจะไม่แสดงป้ายกำกับ ขอแนะนําให้ใช้แอตทริบิวต์ action-aria-label แทนสําหรับการควบคุมมุม แอตทริบิวต์ HTML: label="string"

สล็อต
icon-start	ช่องสำหรับเนื้อหาไอคอนที่เริ่มต้นก่อนป้ายกำกับ ซึ่งใช้สำหรับการควบคุมการทำงานหลักและการควบคุมการทำงานที่มุม เมื่อตัวควบคุมยุบเป็นสถานะมุม เนื้อหาในช่องนี้จะแสดงผล

ชิ้นส่วน
button	ส่วน CSS ที่กำหนดเป้าหมายองค์ประกอบการควบคุมภายใน

เมธอด
สืบทอด: addEventListener, removeEventListener

กิจกรรม
gmp-click	function(event) อาร์กิวเมนต์ event: PlaceActionEvent optional เริ่มทำงานเมื่อมีการคลิกตัวควบคุม

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

อินเทอร์เฟซ google.maps.places.PlaceButtonElementOptions
ติดตั้งใช้งานโดย PlaceButtonElement

ประกาศ: ใช้ได้เฉพาะในเวอร์ชันเบต้าเท่านั้น

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

พร็อพเพอร์ตี้
actionAriaLabel ไม่บังคับ	ประเภท: string optional ป้ายกำกับ ARIA สำหรับการควบคุมภายใน การควบคุมที่มีเฉพาะไอคอนควรมี aria-label เสมอเพื่ออธิบายวัตถุประสงค์และลักษณะการทำงาน ตัวควบคุมที่แสดงผลในมุมจะไม่แสดงป้ายกำกับ ดังนั้นเราขอแนะนำให้ใช้ aria-label แทนป้ายกำกับสำหรับตัวควบคุมมุม
label ไม่บังคับ	ประเภท: string optional ป้ายกำกับที่จะแสดงในการควบคุม ระบบจะละเว้นแอตทริบิวต์นี้สำหรับลิงก์ที่มีประเภทการดำเนินการที่กำหนดไว้ล่วงหน้า ลิงก์และปุ่มที่แสดงผลในช่องมุมการดำเนินการจะไม่แสดงป้ายกำกับ ขอแนะนําให้ใช้แอตทริบิวต์ action-aria-label แทนสําหรับการควบคุมมุม

คลาส PlaceLinkElement

class google.maps.places.PlaceLinkElement extends HTMLElement implements PlaceLinkElementOptions
library "places"

ประกาศ: ใช้ได้เฉพาะในเวอร์ชันเบต้าเท่านั้น

แสดงลิงก์ที่อยู่ในช่อง action-main หรือช่อง action-corner โดยค่าเริ่มต้น ลิงก์จะแสดงในช่อง action-main ใช้แอตทริบิวต์ action เพื่อระบุลักษณะการทำงานของลิงก์ การดำเนินการมีหลายประเภทให้เลือกใช้ตามที่ระบุไว้ใน ActionLinkType สำหรับลิงก์ที่กำหนดเอง ให้ระบุประเภทการดำเนินการ custom และตั้งค่าแอตทริบิวต์ href และ label

<gmp-place-link
  action="value-name"
  action-aria-label="string"
  href="string"
  label="string"
  target="string">
</gmp-place-link>

const {PlaceLinkElement} = await google.maps.importLibrary("places");

พร็อพเพอร์ตี้
action attr: action	ประเภท: ActionLinkType optional ประเภทการดำเนินการที่จะทำเมื่อมีการคลิกลิงก์ กำหนดป้ายกำกับ ไอคอน และ href ปลายทางเริ่มต้นของลิงก์ ใช้ประเภท custom และระบุแอตทริบิวต์ href เพื่อตั้งค่าปลายทางด้วยตนเอง แอตทริบิวต์ HTML: action="value-name"
actionAriaLabel attr: action-aria-label	ประเภท: string optional ค่าเริ่มต้น: undefined ป้ายกำกับ ARIA สำหรับการควบคุมภายใน การควบคุมที่มีเฉพาะไอคอนควรมี aria-label เสมอเพื่ออธิบายวัตถุประสงค์และลักษณะการทำงาน ตัวควบคุมที่แสดงผลในมุมจะไม่แสดงป้ายกำกับ ดังนั้นเราขอแนะนำให้ใช้ aria-label แทนป้ายกำกับสำหรับตัวควบคุมมุม แอตทริบิวต์ HTML: action-aria-label="string"
href attr: href	ประเภท: string optional ค่าเริ่มต้น: undefined URL ที่จะเปิดเมื่อมีการคลิกลิงก์ ระบบจะใช้แอตทริบิวต์นี้เมื่อตั้งค่าแอตทริบิวต์ action เป็น custom เท่านั้น แอตทริบิวต์ HTML: href="string"
label attr: label	ประเภท: string optional ค่าเริ่มต้น: undefined ป้ายกำกับที่จะแสดงในการควบคุม ระบบจะละเว้นแอตทริบิวต์นี้สำหรับลิงก์ที่มีประเภทการดำเนินการที่กำหนดไว้ล่วงหน้า ลิงก์และปุ่มที่แสดงผลในช่องมุมการดำเนินการจะไม่แสดงป้ายกำกับ ขอแนะนําให้ใช้แอตทริบิวต์ action-aria-label แทนสําหรับการควบคุมมุม แอตทริบิวต์ HTML: label="string"
target attr: target	ประเภท: string optional ค่าเริ่มต้น: undefined กำหนดตำแหน่งที่ลิงก์จะเปิดขึ้น ดู https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target แอตทริบิวต์ HTML: target="string"

สล็อต
icon-start	ช่องสำหรับเนื้อหาไอคอนที่เริ่มต้นก่อนป้ายกำกับ ซึ่งใช้สำหรับการควบคุมการทำงานหลักและการควบคุมการทำงานที่มุม เมื่อตัวควบคุมยุบเป็นสถานะมุม เนื้อหาในช่องนี้จะแสดงผล

ชิ้นส่วน
button	ส่วน CSS ที่กำหนดเป้าหมายองค์ประกอบการควบคุมภายใน

เมธอด
สืบทอด: addEventListener, removeEventListener

กิจกรรม
gmp-click	function(event) อาร์กิวเมนต์ event: PlaceActionEvent optional เริ่มทำงานเมื่อมีการคลิกตัวควบคุม

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

อินเทอร์เฟซ google.maps.places.PlaceLinkElementOptions
ติดตั้งใช้งานโดย PlaceLinkElement

ประกาศ: ใช้ได้เฉพาะในเวอร์ชันเบต้าเท่านั้น

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

พร็อพเพอร์ตี้
action ไม่บังคับ	ประเภท: ActionLinkType optional ดูPlaceLinkElement.action
actionAriaLabel ไม่บังคับ	ประเภท: string optional ป้ายกำกับ ARIA สำหรับการควบคุมภายใน การควบคุมที่มีเฉพาะไอคอนควรมี aria-label เสมอเพื่ออธิบายวัตถุประสงค์และลักษณะการทำงาน ตัวควบคุมที่แสดงผลในมุมจะไม่แสดงป้ายกำกับ ดังนั้นเราขอแนะนำให้ใช้ aria-label แทนป้ายกำกับสำหรับตัวควบคุมมุม
href ไม่บังคับ	ประเภท: string optional ดูPlaceLinkElement.href
label ไม่บังคับ	ประเภท: string optional ป้ายกำกับที่จะแสดงในการควบคุม ระบบจะละเว้นแอตทริบิวต์นี้สำหรับลิงก์ที่มีประเภทการดำเนินการที่กำหนดไว้ล่วงหน้า ลิงก์และปุ่มที่แสดงผลในช่องมุมการดำเนินการจะไม่แสดงป้ายกำกับ ขอแนะนําให้ใช้แอตทริบิวต์ action-aria-label แทนสําหรับการควบคุมมุม
target ไม่บังคับ	ประเภท: string optional ดูPlaceLinkElement.target

ค่าคงที่ ActionLinkType

constants google.maps.places.ActionLinkType
library "places"

ประกาศ: ใช้ได้เฉพาะในเวอร์ชันเบต้าเท่านั้น

การดำเนินการที่ PlaceLinkElement ทำเมื่อมีการคลิก กำหนดไอคอน ป้ายกำกับ และปลายทาง href

ค่าคงที่เหล่านี้ยังใช้เป็นสตริงได้ด้วย ใน TypeScript สตริงลิเทอรัลจะกำหนดโดยประเภท ActionLinkTypeString

const {ActionLinkType} = await google.maps.importLibrary("places");

ค่าคงที่
CALL	ทริกเกอร์ลิงก์ tel: เพื่อโทรหาสถานที่ ลักษณะการทำงานจะขึ้นอยู่กับระบบปฏิบัติการ
CUSTOM	ใช้การดำเนินการประเภทนี้สำหรับลิงก์ที่กำหนดเอง เมื่อใช้การดำเนินการประเภทนี้ คุณต้องตั้งค่าแอตทริบิวต์ href ใน PlaceLinkElement
OPEN_DIRECTIONS	เปิดเส้นทางไปยังสถานที่ในตำแหน่งที่ระบุโดย PlaceLinkElement.target
OPEN_MAP	เปิดแผนที่ในตำแหน่งที่ระบุโดย PlaceLinkElement.target
OPEN_WEBSITE	เปิดเว็บไซต์ของสถานที่ในตำแหน่งที่ระบุโดย PlaceLinkElement.target

ค่าคงที่ ActionButtonPosition

constants google.maps.places.ActionButtonPosition
library "places"

ประกาศ: ใช้ได้เฉพาะในเวอร์ชันเบต้าเท่านั้น

ตำแหน่งที่กำหนดของตัวควบคุมในวิดเจ็ตรายละเอียดสถานที่

ค่าคงที่เหล่านี้ยังใช้เป็นสตริงได้ด้วย ใน TypeScript สตริงลิเทอรัลจะกำหนดโดยประเภท ActionButtonPositionString

const {ActionButtonPosition} = await google.maps.importLibrary("places");

ค่าคงที่
ACTION_CORNER	การควบคุมจะแสดงที่มุมของวิดเจ็ต การควบคุมมุมจะแสดงเฉพาะไอคอน
ACTION_MAIN	การควบคุมจะแสดงในพื้นที่เนื้อหาหลักของวิดเจ็ต ระบบจะแสดงผลป้ายกำกับและไอคอน

คลาส PlaceActionEvent

class google.maps.places.PlaceActionEvent extends Event
library "places"

ประกาศ: ใช้ได้เฉพาะในเวอร์ชันเบต้าเท่านั้น

เหตุการณ์เริ่มทำงานเมื่อมีการคลิกปุ่มดำเนินการ

const {PlaceActionEvent} = await google.maps.importLibrary("places");

พร็อพเพอร์ตี้
place readonly	ประเภท: Place สถานที่ที่มีการคลิก

คลาส PlaceNameElement

class google.maps.places.PlaceNameElement extends HTMLElement implements PlaceNameElementOptions
library "places"

ประกาศ: ใช้ได้เฉพาะในเวอร์ชันเบต้าเท่านั้น

แสดงชื่อสถานที่ภายในองค์ประกอบรายละเอียดสถานที่

<gmp-place-name></gmp-place-name>

const {PlaceNameElement} = await google.maps.importLibrary("places");

เมธอด
สืบทอด: addEventListener, removeEventListener

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

อินเทอร์เฟซ google.maps.places.PlaceNameElementOptions
ติดตั้งใช้งานโดย PlaceNameElement

ประกาศ: ใช้ได้เฉพาะในเวอร์ชันเบต้าเท่านั้น

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