Introducing Places UI Kit: A ready-to-use, low-cost component library that lets you bring the familiar Google Maps UI for Places to any map of your choice. Try it out, andshare your input to help shape the future of GMP!

Place Widget Content Customization

PlaceContentConfigElementclass

google.maps.places.PlaceContentConfigElementclass

Configures aPlaceDetailsCompactElement,PlaceDetailsElement orPlaceSearchElement to show a custom set of content. Append this element as a child to use it.

ForPlaceDetailsCompactElement,PlaceDetailsElement orPlaceSearchElement, append any of the following elements to thePlaceContentConfigElement to show the corresponding content:
PlaceAddressElement,PlaceAccessibleEntranceIconElement,PlaceAttributionElementPlaceMediaElement,PlaceOpenNowStatusElement,PlacePriceElement,PlaceRatingElement,PlaceTypeElement.

Specific toPlaceDetailsElement, you may also append any of the following elements:
PlaceFeatureListElementPlaceOpeningHoursElement,PlacePhoneNumberElement,PlacePlusCodeElement,PlaceReviewsElement,PlaceSummaryElement,PlaceTypeSpecificHighlightsElement,PlaceWebsiteElement.

The order of the children does not matter; the element renders content in a standard order which is not customizable. Example:

 <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>

Custom element:
<gmp-place-content-config></gmp-place-content-config>

This class extendsHTMLElement.

This class implementsPlaceContentConfigElementOptions.

Access by callingconst {PlaceContentConfigElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlaceContentConfigElement
PlaceContentConfigElement([options])
Parameters: 

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceContentConfigElementOptionsinterface

google.maps.places.PlaceContentConfigElementOptionsinterface

Options forPlaceContentConfigElement.

PlaceAllContentElementclass

google.maps.places.PlaceAllContentElementclass

Configures aPlaceDetailsCompactElement,PlaceDetailsElement, orPlaceSearchElement to show all available content. Append this element as a child to use it. For example:

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

Custom element:
<gmp-place-all-content></gmp-place-all-content>

This class extendsHTMLElement.

This class implementsPlaceAllContentElementOptions.

Access by callingconst {PlaceAllContentElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlaceAllContentElement
PlaceAllContentElement([options])
Parameters: 

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceAllContentElementOptionsinterface

google.maps.places.PlaceAllContentElementOptionsinterface

Options forPlaceAllContentElement.

PlaceStandardContentElementclass

google.maps.places.PlaceStandardContentElementclass

Configures aPlaceDetailsCompactElement,PlaceDetailsElement, orPlaceSearchElement to show a standard set of content. Append this element as a child to use it.
ForPlaceDetailsElement, standard content consists of:

  • media
  • address
  • rating
  • type
  • price
  • accessible entrance icon
  • website
  • phone number
  • opening hours
  • summary
  • type specific highlights
  • reviews
  • feature list

ForPlaceDetailsCompactElement, standard content consists of:
  • media
  • rating
  • type
  • price
  • accessible entrance icon
  • open now status

ForPlaceSearchElement, standard content consists of:
  • media
  • rating
  • type
  • price
  • accessible entrance icon

For example:
 <gmp-place-details>
  <gmp-place-standard-content></gmp-place-standard-content>
</gmp-place-details>

Custom element:
<gmp-place-standard-content></gmp-place-standard-content>

This class extendsHTMLElement.

This class implementsPlaceStandardContentElementOptions.

Access by callingconst {PlaceStandardContentElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlaceStandardContentElement
PlaceStandardContentElement([options])
Parameters: 

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceStandardContentElementOptionsinterface

google.maps.places.PlaceStandardContentElementOptionsinterface

Options forPlaceStandardContentElement.

PlaceMediaElementclass

google.maps.places.PlaceMediaElementclass

Configures aPlaceDetailsCompactElement,PlaceDetailsElement, orPlaceSearchElement to show a place's media, such as photos. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-media lightbox-preferred preferred-size="small"></gmp-place-media>

This class extendsHTMLElement.

This class implementsPlaceMediaElementOptions.

Access by callingconst {PlaceMediaElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlaceMediaElement
PlaceMediaElement([options])
Parameters: 

Properties

lightboxPreferred
Type: booleanoptional
Default:false
Whether to enable or disable the media lightbox, in cases where both options are supported.
HTML attribute:
  • <gmp-place-media lightbox-preferred></gmp-place-media>
preferredSize
Type: MediaSizeoptional
Default:null
The preferred media size in cases where multiple sizes are supported, such as the verticalPlaceSearchElement. The verticalPlaceSearchElement will useMediaSize.SMALL by default if this is not specified.
HTML attribute:
  • <gmp-place-media preferred-size="small"></gmp-place-media>
  • <gmp-place-media preferred-size="medium"></gmp-place-media>
  • <gmp-place-media preferred-size="large"></gmp-place-media>

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceMediaElementOptionsinterface

google.maps.places.PlaceMediaElementOptionsinterface

Options forPlaceMediaElement.

Properties

lightboxPreferredoptional
Type: booleanoptional
preferredSizeoptional
Type: MediaSizeoptional

MediaSizeconstants

google.maps.places.MediaSizeconstants

The preferred media size in cases where multiple sizes are supported, such as the verticalPlaceSearchElement.

Access by callingconst {MediaSize} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constants

LARGELarge media size.
MEDIUMMedium media size.
SMALLSmall media size.

PlaceAddressElementclass

google.maps.places.PlaceAddressElementclass

Configures aPlaceDetailsCompactElement,PlaceDetailsElement, orPlaceSearchElement to show a place's address. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-address></gmp-place-address>

This class extendsHTMLElement.

This class implementsPlaceAddressElementOptions.

Access by callingconst {PlaceAddressElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlaceAddressElement
PlaceAddressElement([options])
Parameters: 

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceAddressElementOptionsinterface

google.maps.places.PlaceAddressElementOptionsinterface

Options forPlaceAddressElement.

PlaceRatingElementclass

google.maps.places.PlaceRatingElementclass

Configures aPlaceDetailsCompactElement,PlaceDetailsElement, orPlaceSearchElement to show a place's rating. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-rating></gmp-place-rating>

This class extendsHTMLElement.

This class implementsPlaceRatingElementOptions.

Access by callingconst {PlaceRatingElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlaceRatingElement
PlaceRatingElement([options])
Parameters: 

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceRatingElementOptionsinterface

google.maps.places.PlaceRatingElementOptionsinterface

Options forPlaceRatingElement.

PlaceTypeElementclass

google.maps.places.PlaceTypeElementclass

Configures aPlaceDetailsCompactElement,PlaceDetailsElement, orPlaceSearchElement to show a place's type. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-type></gmp-place-type>

This class extendsHTMLElement.

This class implementsPlaceTypeElementOptions.

Access by callingconst {PlaceTypeElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlaceTypeElement
PlaceTypeElement([options])
Parameters: 

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceTypeElementOptionsinterface

google.maps.places.PlaceTypeElementOptionsinterface

Options forPlaceTypeElement.

PlacePriceElementclass

google.maps.places.PlacePriceElementclass

Configures aPlaceDetailsCompactElement,PlaceDetailsElement, orPlaceSearchElement to show a place's price level or price range. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-price></gmp-place-price>

This class extendsHTMLElement.

This class implementsPlacePriceElementOptions.

Access by callingconst {PlacePriceElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlacePriceElement
PlacePriceElement([options])
Parameters: 

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlacePriceElementOptionsinterface

google.maps.places.PlacePriceElementOptionsinterface

Options forPlacePriceElement.

PlaceAccessibleEntranceIconElementclass

google.maps.places.PlaceAccessibleEntranceIconElementclass

Configures aPlaceDetailsCompactElement,PlaceDetailsElement, orPlaceSearchElement to show a wheelchair icon if the place has an accessible entrance. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-accessible-entrance-icon></gmp-place-accessible-entrance-icon>

This class extendsHTMLElement.

This class implementsPlaceAccessibleEntranceIconElementOptions.

Access by callingconst {PlaceAccessibleEntranceIconElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlaceAccessibleEntranceIconElement
PlaceAccessibleEntranceIconElement([options])
Parameters: 

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceAccessibleEntranceIconElementOptionsinterface

google.maps.places.PlaceAccessibleEntranceIconElementOptionsinterface

Options forPlaceAccessibleEntranceIconElement.

PlaceOpenNowStatusElementclass

google.maps.places.PlaceOpenNowStatusElementclass

Configures aPlaceDetailsCompactElement,PlaceDetailsElement, orPlaceSearchElement to show the current open or closed status of a place. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-open-now-status></gmp-place-open-now-status>

This class extendsHTMLElement.

This class implementsPlaceOpenNowStatusElementOptions.

Access by callingconst {PlaceOpenNowStatusElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlaceOpenNowStatusElement
PlaceOpenNowStatusElement([options])
Parameters: 

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceOpenNowStatusElementOptionsinterface

google.maps.places.PlaceOpenNowStatusElementOptionsinterface

Options forPlaceOpenNowStatusElement.

PlaceReviewsElementclass

google.maps.places.PlaceReviewsElementclass

Configures aPlaceDetailsElement to show a place's reviews. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-reviews></gmp-place-reviews>

This class extendsHTMLElement.

This class implementsPlaceReviewsElementOptions.

Access by callingconst {PlaceReviewsElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceReviewsElementOptionsinterface

google.maps.places.PlaceReviewsElementOptionsinterface

Options forPlaceReviewsElement.

PlaceSummaryElementclass

google.maps.places.PlaceSummaryElementclass

Configures aPlaceDetailsElement to show a place's summary. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-summary></gmp-place-summary>

This class extendsHTMLElement.

This class implementsPlaceSummaryElementOptions.

Access by callingconst {PlaceSummaryElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceSummaryElementOptionsinterface

google.maps.places.PlaceSummaryElementOptionsinterface

Options forPlaceSummaryElement.

PlaceFeatureListElementclass

google.maps.places.PlaceFeatureListElementclass

Configures aPlaceDetailsElement to show a place's feature list in the "About" tab. Feature list can include accessibility options, amenities, accepted payment methods, and more. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-feature-list></gmp-place-feature-list>

This class extendsHTMLElement.

This class implementsPlaceFeatureListElementOptions.

Access by callingconst {PlaceFeatureListElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceFeatureListElementOptionsinterface

google.maps.places.PlaceFeatureListElementOptionsinterface

Options forPlaceFeatureListElement.

PlaceOpeningHoursElementclass

google.maps.places.PlaceOpeningHoursElementclass

Configures aPlaceDetailsElement to show a place's opening hours. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-opening-hours></gmp-place-opening-hours>

This class extendsHTMLElement.

This class implementsPlaceOpeningHoursElementOptions.

Access by callingconst {PlaceOpeningHoursElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceOpeningHoursElementOptionsinterface

google.maps.places.PlaceOpeningHoursElementOptionsinterface

Options forPlaceOpeningHoursElement.

PlacePhoneNumberElementclass

google.maps.places.PlacePhoneNumberElementclass

Configures aPlaceDetailsElement to show a place's phone number. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-phone-number></gmp-place-phone-number>

This class extendsHTMLElement.

This class implementsPlacePhoneNumberElementOptions.

Access by callingconst {PlacePhoneNumberElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlacePhoneNumberElementOptionsinterface

google.maps.places.PlacePhoneNumberElementOptionsinterface

Options forPlacePhoneNumberElement.

PlacePlusCodeElementclass

google.maps.places.PlacePlusCodeElementclass

Configures aPlaceDetailsElement to show a place's plus code. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-plus-code></gmp-place-plus-code>

This class extendsHTMLElement.

This class implementsPlacePlusCodeElementOptions.

Access by callingconst {PlacePlusCodeElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlacePlusCodeElementOptionsinterface

google.maps.places.PlacePlusCodeElementOptionsinterface

Options forPlacePlusCodeElement.

PlaceTypeSpecificHighlightsElementclass

google.maps.places.PlaceTypeSpecificHighlightsElementclass

Configures aPlaceDetailsElement to show a place's type-specific highlights, such as gas prices and EV charger availability. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-type-specific-highlights></gmp-place-type-specific-highlights>

This class extendsHTMLElement.

This class implementsPlaceTypeSpecificHighlightsElementOptions.

Access by callingconst {PlaceTypeSpecificHighlightsElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceTypeSpecificHighlightsElementOptionsinterface

google.maps.places.PlaceTypeSpecificHighlightsElementOptionsinterface

Options forPlaceTypeSpecificHighlightsElement.

PlaceWebsiteElementclass

google.maps.places.PlaceWebsiteElementclass

Configures aPlaceDetailsElement to show a place's website. Append this element as a child of aPlaceContentConfigElement to use it. For example:

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

Custom element:
<gmp-place-website></gmp-place-website>

This class extendsHTMLElement.

This class implementsPlaceWebsiteElementOptions.

Access by callingconst {PlaceWebsiteElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceWebsiteElementOptionsinterface

google.maps.places.PlaceWebsiteElementOptionsinterface

Options forPlaceWebsiteElement.

PlaceAttributionElementclass

google.maps.places.PlaceAttributionElementclass

Allows customization of the Google Maps attribution text in aPlaceDetailsCompactElement,PlaceDetailsElement, orPlaceSearchElement. Append this element as a child of aPlaceContentConfigElement to use it. If this element is omitted, attribution will still be shown with default colors. For example:

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

Custom element:
<gmp-place-attribution dark-scheme-color="white" light-scheme-color="white"></gmp-place-attribution>

This class extendsHTMLElement.

This class implementsPlaceAttributionElementOptions.

Access by callingconst {PlaceAttributionElement} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constructor

PlaceAttributionElement
PlaceAttributionElement([options])
Parameters: 

Properties

darkSchemeColor
Type: AttributionColoroptional
Default:AttributionColor.WHITE
The color of the Google Maps attribution in dark mode.
HTML attribute:
  • <gmp-place-attribution dark-scheme-color="white"></gmp-place-attribution>
  • <gmp-place-attribution dark-scheme-color="black"></gmp-place-attribution>
  • <gmp-place-attribution dark-scheme-color="gray"></gmp-place-attribution>
lightSchemeColor
Type: AttributionColoroptional
Default:AttributionColor.GRAY
The color of the Google Maps attribution in light mode.
HTML attribute:
  • <gmp-place-attribution light-scheme-color="white"></gmp-place-attribution>
  • <gmp-place-attribution light-scheme-color="black"></gmp-place-attribution>
  • <gmp-place-attribution light-scheme-color="gray"></gmp-place-attribution>

Methods

BetaaddEventListener

Notice: Available only in thev=beta channel.

addEventListener(type, listener[, options])
Parameters: 
  • typestring A case-sensitive string representing the event type to listen for.
  • listenerEventListener|EventListenerObject The object that receives a notification. This must be a function or an object with the handleEvent method
  • optionsboolean|AddEventListenerOptionsoptional Seeoptions. Custom events only supportcapture andpassive.
Return Value: void
Sets up a function that will be called whenever the specified event is delivered to the target. SeeaddEventListener.
BetaremoveEventListener

Notice: Available only in thev=beta channel.

removeEventListener(type, listener[, options])
Parameters: 
Return Value: void
Removes an event listener previously registered with addEventListener from the target. SeeremoveEventListener.

PlaceAttributionElementOptionsinterface

google.maps.places.PlaceAttributionElementOptionsinterface

Options forPlaceAttributionElement.

Properties

darkSchemeColoroptional
Type: AttributionColoroptional
lightSchemeColoroptional
Type: AttributionColoroptional

AttributionColorconstants

google.maps.places.AttributionColorconstants

Color options for Google Maps attribution text. Attribution may be customized to use any of these colors.

Access by callingconst {AttributionColor} = await google.maps.importLibrary("places").
SeeLibraries in the Maps JavaScript API.

Constants

BLACKBlack attribution text.
GRAYGray attribution text.
WHITEWhite attribution text.

Except as otherwise noted, the content of this page is licensed under theCreative Commons Attribution 4.0 License, and code samples are licensed under theApache 2.0 License. For details, see theGoogle Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.

Last updated 2025-07-18 UTC.