Place Widget Content Customization

PlaceContentConfigElement 클래스

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

지원 중단됨: 콘텐츠 요소 또는 사전 설정 요소 (PlaceAllContentElement, PlaceStandardContentElement)를 PlaceDetailsElement 또는 PlaceDetailsCompactElement에 직접 추가하거나 PlaceSearchElement의 <template slot="details-item"> 하위 요소 내에 추가합니다. 현재로서는 PlaceContentConfigElement를 중단할 계획이 없습니다. 지원이 중단되기 최소 12개월 전에 알림이 제공될 예정입니다. 자세한 내용은 https://developers.google.com/maps/deprecations를 참고하세요.

맞춤 콘텐츠 세트를 표시하도록 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에서 구현됨

지원 중단됨: 콘텐츠 요소 또는 사전 설정 요소 (PlaceAllContentElement, PlaceStandardContentElement)를 PlaceDetailsElement 또는 PlaceDetailsCompactElement에 직접 추가하거나 PlaceSearchElement의 <template slot="details-item"> 하위 요소 내에 추가합니다. 현재로서는 PlaceContentConfigElement를 중단할 계획이 없습니다. 지원이 중단되기 최소 12개월 전에 알림이 제공될 예정입니다. 자세한 내용은 https://developers.google.com/maps/deprecations를 참고하세요.

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 두 옵션이 모두 지원되는 경우 미디어 라이트박스를 사용 설정할지 또는 사용 중지할지 여부입니다. 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 상수

상수 google.maps.places.MediaSize
라이브러리 "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"

장소의 Plus Code를 표시하도록 PlaceDetailsElement를 구성합니다. 이 요소를 사용하려면 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"

주유소 가격, EV 충전기 사용 가능 여부와 같은 장소의 유형별 하이라이트를 표시하도록 PlaceDetailsElement를 구성합니다. 이 요소를 사용하려면 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"

PlaceDetailsCompactElement, PlaceDetailsElement 또는 PlaceSearchElement에서 Google 지도 저작자 표시 텍스트를 맞춤설정할 수 있습니다. 이 요소를 사용하려면 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 지도 저작자 표시의 색상입니다. HTML 속성: dark-scheme-color="value-name"
lightSchemeColor attr: light-scheme-color	입력 유형: AttributionColor optional 출력 유형: AttributionColor 기본값: AttributionColor.GRAY 밝은 모드에서 Google 지도 저작자 표시의 색상입니다. 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 상수

상수 google.maps.places.AttributionColor
라이브러리 "places"

Google 지도 저작자 표시 텍스트의 색상 옵션입니다. 이러한 색상을 사용하도록 저작자 표시를 맞춤설정할 수 있습니다.

이러한 상수는 문자열로도 사용할 수 있습니다. 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에는 기본 동작이 없습니다. 요소에 이벤트 리스너를 연결하여 동작을 정의합니다. 기본적으로 버튼은 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"
  default-icon-hidden
  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"
defaultIconHidden attr: default-icon-hidden	입력 유형: boolean optional 출력 유형: boolean 기본값: false 커스텀을 제외한 모든 링크 유형에서 기본 아이콘이 숨겨지는지 여부입니다. HTML 속성: default-icon-hidden
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 상수

상수 google.maps.places.ActionLinkType
라이브러리 "places"

PlaceLinkElement를 클릭할 때 수행되는 작업입니다. 아이콘, 라벨, href 대상을 결정합니다.

이러한 상수는 문자열로도 사용할 수 있습니다. TypeScript에서 문자열 리터럴은 ActionLinkTypeString 유형으로 정의됩니다.

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

상수
CALL	tel: 링크를 트리거하여 장소에 전화를 겁니다. 동작은 운영체제에 따라 다릅니다.
CUSTOM	맞춤 링크에 이 작업 유형을 사용합니다. 이 작업 유형을 사용할 때는 PlaceLinkElement에 href 속성을 설정해야 합니다.
OPEN_DIRECTIONS	PlaceLinkElement.target에 지정된 위치의 장소로 가는 경로를 엽니다.
OPEN_MAP	PlaceLinkElement.target로 지정된 위치에서 지도를 엽니다.
OPEN_WEBSITE	PlaceLinkElement.target로 지정된 위치에서 장소의 웹사이트를 엽니다.

ActionButtonPosition 상수

상수 google.maps.places.ActionButtonPosition
라이브러리 "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 옵션