Places Widgets

Clase BasicPlaceAutocompleteElement

Clase google.maps.places.BasicPlaceAutocompleteElement

BasicPlaceAutocompleteElement es una subclase de HTMLElement que proporciona un componente de IU para la API de Places Autocomplete.

Elemento personalizado:
<gmp-basic-place-autocomplete included-primary-types="type1 type2 type3..." included-region-codes="c1 c2 c3..." name="string" origin="lat,lng" requested-language="string" requested-region="string" unit-system="metric"></gmp-basic-place-autocomplete>

Esta clase extiende HTMLElement.

Esta clase implementa BasicPlaceAutocompleteElementOptions.

Llama al const {BasicPlaceAutocompleteElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
BasicPlaceAutocompleteElement
BasicPlaceAutocompleteElement(options)
Parámetros: 
includedPrimaryTypes
Tipo:  Array<string> optional
Es el Tipo de lugar principal incluido (por ejemplo, "restaurant" o "gas_station").

Solo se devuelve un lugar si su tipo principal se incluye en esta lista. Se pueden especificar hasta 5 valores. Si no se especifican tipos, se devuelven todos los tipos de Place.
Atributo HTML:
  • <gmp-basic-place-autocomplete included-primary-types="type1 type2 type3..."></gmp-basic-place-autocomplete>
includedRegionCodes
Tipo:  Array<string> optional
Solo se incluyen los resultados de las regiones especificadas, que se indican con hasta 15 códigos de región CLDR de dos caracteres. Un conjunto vacío no restringirá los resultados. Si se configuran locationRestriction y includedRegionCodes, los resultados se ubicarán en el área de intersección.
Atributo HTML:
  • <gmp-basic-place-autocomplete included-region-codes="c1 c2 c3..."></gmp-basic-place-autocomplete>
locationBias
Tipo:  LocationBias optional
Es un límite o una sugerencia flexible que se usa cuando se buscan lugares.
locationRestriction
Tipo:  LocationRestriction optional
Son los límites para restringir los resultados de la búsqueda.
name
Tipo:  string optional
Nombre que se usará para el elemento de entrada. Consulta https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name para obtener más detalles. Sigue el mismo comportamiento que el atributo name para las entradas. Ten en cuenta que este es el nombre que se usará cuando se envíe un formulario. Consulta https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form para obtener más detalles.
Atributo HTML:
  • <gmp-basic-place-autocomplete name="string"></gmp-basic-place-autocomplete>
origin
Es el origen desde el que se calcula la distancia. Si no se especifica, no se calcula la distancia. Si se proporciona la altitud, no se usa en el cálculo.
Atributo HTML:
  • <gmp-basic-place-autocomplete origin="lat,lng"></gmp-basic-place-autocomplete>
  • <gmp-basic-place-autocomplete origin="lat,lng,altitude"></gmp-basic-place-autocomplete>
requestedLanguage
Tipo:  string optional
Es un identificador de idioma para el idioma en el que se deben devolver los resultados, si es posible. Es posible que los resultados en el idioma seleccionado tengan una clasificación más alta, pero las sugerencias no se limitan a este idioma. Consulta la lista de idiomas compatibles.
Atributo HTML:
  • <gmp-basic-place-autocomplete requested-language="string"></gmp-basic-place-autocomplete>
requestedRegion
Tipo:  string optional
Es un código de región que se usa para el formato y el filtrado de los resultados. No restringe las sugerencias a este país. El código de región acepta un valor de ccTLD ("dominio de nivel superior") de dos caracteres. La mayoría de los códigos ccTLD son idénticos a los códigos ISO 3166-1, con algunas excepciones notables. Por ejemplo, el ccTLD del Reino Unido es "uk" (.co.uk), mientras que su código ISO 3166-1 es "gb" (técnicamente para la entidad de "El Reino Unido de Gran Bretaña e Irlanda del Norte").
Atributo HTML:
  • <gmp-basic-place-autocomplete requested-region="string"></gmp-basic-place-autocomplete>
unitSystem
Tipo:  UnitSystem optional
Es el sistema de unidades que se usa para mostrar las distancias. Si no se especifica, el sistema de unidades se determina según el valor de requestedRegion.
Atributo HTML:
  • <gmp-basic-place-autocomplete unit-system="metric"></gmp-basic-place-autocomplete>
  • <gmp-basic-place-autocomplete unit-system="imperial"></gmp-basic-place-autocomplete>
prediction-item-icon
Esta ranura acepta exactamente un elemento <template> para renderizarlo como el ícono que se muestra junto al elemento de predicción.
prediction-item
Es un elemento del menú desplegable de predicciones que representa una sola predicción.
prediction-item-icon
Icono que aparece a la izquierda de cada elemento de la lista de predicciones.
prediction-item-main-text
Es una parte del elemento de predicción que es el texto principal de la predicción. En el caso de las ubicaciones geográficas, contiene un nombre de lugar, como "Sídney", o un nombre y un número de una calle, como "10 King Street". De forma predeterminada, el texto principal del elemento de predicción es de color negro. Si hay texto adicional en prediction-item, este queda fuera de prediction-item-main-text y hereda su diseño de prediction-item. Su color predeterminado es el gris. El texto adicional normalmente es una dirección.
prediction-item-match
La parte de la predicción mostrada que coincide con la entrada del usuario. De manera predeterminada, este texto coincidente se resalta en negrita. Ten en cuenta que el texto coincidente puede estar en cualquier parte de prediction-item. No necesariamente forma parte de prediction-item-main-text.
prediction-item-selected
La figura que aparece cuando el usuario navega a un elemento a través del teclado. Nota: Los elementos seleccionados se verán afectados por los estilos de esta parte y por los estilos de la parte del elemento de predicción.
prediction-list
Elemento visual que contiene la lista de predicciones devueltas por el servicio de autocompletado de sitios. Esta lista aparece como una lista desplegable debajo del PlaceAutocompleteElement.
background-color
Anula el color de fondo del elemento.
border
Anula el borde del elemento.
border-radius
Anula el radio del borde del elemento.
color-scheme
Indica con qué esquema de color se puede renderizar este elemento. Consulta la documentación de color-scheme para obtener más detalles. La configuración predeterminada es color-scheme: light dark.
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.
gmp-error
function(errorEvent)
Argumentos: 
Este evento se activa cuando se rechaza una solicitud al backend (p.ej., clave de API incorrecta). Este evento no se propaga.
gmp-select
function(placeSelectEvent)
Argumentos: 
Este evento se activa cuando un usuario selecciona una predicción de lugar. Contiene un objeto Place.

Interfaz BasicPlaceAutocompleteElementOptions

Interfaz de google.maps.places.BasicPlaceAutocompleteElementOptions

Opciones para construir un BasicPlaceAutocompleteElement.
includedPrimaryTypes optional
Tipo:  Array<string> optional
includedRegionCodes optional
Tipo:  Array<string> optional
locationBias optional
Tipo:  LocationBias optional
locationRestriction optional
Tipo:  LocationRestriction optional
name optional
Tipo:  string optional
origin optional
requestedLanguage optional
Tipo:  string optional
requestedRegion optional
Tipo:  string optional
unitSystem optional
Tipo:  UnitSystem optional

Clase PlaceAutocompleteElement

Clase google.maps.places.PlaceAutocompleteElement

PlaceAutocompleteElement es una subclase de HTMLElement que proporciona un componente de IU para la API de Places Autocomplete.

PlaceAutocompleteElement usa automáticamente AutocompleteSessionTokens de forma interna para agrupar las fases de consulta y selección de la búsqueda con autocompletado de un usuario.

La primera llamada a Place.fetchFields en un Place que muestra PlacePrediction.toPlace incluirá automáticamente el token de sesión que se usó para recuperar el PlacePrediction.

Consulta https://developers.google.com/maps/documentation/places/web-service/place-session-tokens para obtener más detalles sobre cómo funcionan las sesiones.

Elemento personalizado:
<gmp-place-autocomplete included-primary-types="type1 type2 type3..." included-region-codes="c1 c2 c3..." name="string" origin="lat,lng" requested-language="string" requested-region="string" unit-system="metric"></gmp-place-autocomplete>

Esta clase extiende HTMLElement.

Esta clase implementa PlaceAutocompleteElementOptions.

Llama al const {PlaceAutocompleteElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
PlaceAutocompleteElement
PlaceAutocompleteElement(options)
Parámetros: 
includedPrimaryTypes
Tipo:  Array<string> optional
Es el Tipo de lugar principal incluido (por ejemplo, "restaurant" o "gas_station").

Solo se devuelve un lugar si su tipo principal se incluye en esta lista. Se pueden especificar hasta 5 valores. Si no se especifican tipos, se devuelven todos los tipos de Place.
Atributo HTML:
  • <gmp-place-autocomplete included-primary-types="type1 type2 type3..."></gmp-place-autocomplete>
includedRegionCodes
Tipo:  Array<string> optional
Solo se incluyen los resultados de las regiones especificadas, que se indican con hasta 15 códigos de región CLDR de dos caracteres. Un conjunto vacío no restringirá los resultados. Si se configuran locationRestriction y includedRegionCodes, los resultados se ubicarán en el área de intersección.
Atributo HTML:
  • <gmp-place-autocomplete included-region-codes="c1 c2 c3..."></gmp-place-autocomplete>
locationBias
Tipo:  LocationBias optional
Es un límite o una sugerencia flexible que se usa cuando se buscan lugares.
locationRestriction
Tipo:  LocationRestriction optional
Son los límites para restringir los resultados de la búsqueda.
name
Tipo:  string optional
Nombre que se usará para el elemento de entrada. Consulta https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name para obtener más detalles. Sigue el mismo comportamiento que el atributo name para las entradas. Ten en cuenta que este es el nombre que se usará cuando se envíe un formulario. Consulta https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form para obtener más detalles.
Atributo HTML:
  • <gmp-place-autocomplete name="string"></gmp-place-autocomplete>
origin
Es el origen desde el que se calcula la distancia. Si no se especifica, no se calcula la distancia. Si se proporciona la altitud, no se usa en el cálculo.
Atributo HTML:
  • <gmp-place-autocomplete origin="lat,lng"></gmp-place-autocomplete>
  • <gmp-place-autocomplete origin="lat,lng,altitude"></gmp-place-autocomplete>
requestedLanguage
Tipo:  string optional
Es un identificador de idioma para el idioma en el que se deben devolver los resultados, si es posible. Es posible que los resultados en el idioma seleccionado tengan una clasificación más alta, pero las sugerencias no se limitan a este idioma. Consulta la lista de idiomas compatibles.
Atributo HTML:
  • <gmp-place-autocomplete requested-language="string"></gmp-place-autocomplete>
requestedRegion
Tipo:  string optional
Es un código de región que se usa para el formato y el filtrado de los resultados. No restringe las sugerencias a este país. El código de región acepta un valor de ccTLD ("dominio de nivel superior") de dos caracteres. La mayoría de los códigos ccTLD son idénticos a los códigos ISO 3166-1, con algunas excepciones notables. Por ejemplo, el ccTLD del Reino Unido es "uk" (.co.uk), mientras que su código ISO 3166-1 es "gb" (técnicamente para la entidad de "El Reino Unido de Gran Bretaña e Irlanda del Norte").
Atributo HTML:
  • <gmp-place-autocomplete requested-region="string"></gmp-place-autocomplete>
unitSystem
Tipo:  UnitSystem optional
Es el sistema de unidades que se usa para mostrar las distancias. Si no se especifica, el sistema de unidades se determina según el valor de requestedRegion.
Atributo HTML:
  • <gmp-place-autocomplete unit-system="metric"></gmp-place-autocomplete>
  • <gmp-place-autocomplete unit-system="imperial"></gmp-place-autocomplete>
prediction-item
Es un elemento del menú desplegable de predicciones que representa una sola predicción.
prediction-item-icon
Icono que aparece a la izquierda de cada elemento de la lista de predicciones.
prediction-item-main-text
Es una parte del elemento de predicción que es el texto principal de la predicción. En el caso de las ubicaciones geográficas, contiene un nombre de lugar, como "Sídney", o un nombre y un número de una calle, como "10 King Street". De forma predeterminada, el texto principal del elemento de predicción es de color negro. Si hay texto adicional en prediction-item, este queda fuera de prediction-item-main-text y hereda su diseño de prediction-item. Su color predeterminado es el gris. El texto adicional normalmente es una dirección.
prediction-item-match
La parte de la predicción mostrada que coincide con la entrada del usuario. De manera predeterminada, este texto coincidente se resalta en negrita. Ten en cuenta que el texto coincidente puede estar en cualquier parte de prediction-item. No necesariamente forma parte de prediction-item-main-text.
prediction-item-selected
La figura que aparece cuando el usuario navega a un elemento a través del teclado. Nota: Los elementos seleccionados se verán afectados por los estilos de esta parte y por los estilos de la parte del elemento de predicción.
prediction-list
Elemento visual que contiene la lista de predicciones devueltas por el servicio de autocompletado de sitios. Esta lista aparece como una lista desplegable debajo del PlaceAutocompleteElement.
background-color
Anula el color de fondo del elemento.
border
Anula el borde del elemento.
border-radius
Anula el radio del borde del elemento.
color-scheme
Indica con qué esquema de color se puede renderizar este elemento. Consulta la documentación de color-scheme para obtener más detalles. La configuración predeterminada es color-scheme: light dark.
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.
gmp-error
function(errorEvent)
Argumentos: 
Este evento se activa cuando se rechaza una solicitud al backend (p.ej., clave de API incorrecta). Este evento no se propaga.
gmp-select
function(placePredictionSelectEvent)
Argumentos: 
Este evento se activa cuando un usuario selecciona una predicción de lugar. Contiene un objeto PlacePrediction que se puede convertir en un objeto Place.

Interfaz PlaceAutocompleteElementOptions

Interfaz de google.maps.places.PlaceAutocompleteElementOptions

Opciones para construir un PlaceAutocompleteElement. Para obtener la descripción de cada propiedad, consulta la propiedad con el mismo nombre en la clase PlaceAutocompleteElement.
includedPrimaryTypes optional
Tipo:  Array<string> optional
includedRegionCodes optional
Tipo:  Array<string> optional
locationBias optional
Tipo:  LocationBias optional
locationRestriction optional
Tipo:  LocationRestriction optional
name optional
Tipo:  string optional
origin optional
requestedLanguage optional
Tipo:  string optional
requestedRegion optional
Tipo:  string optional
unitSystem optional
Tipo:  UnitSystem optional

Clase PlacePredictionSelectEvent

Clase google.maps.places.PlacePredictionSelectEvent

Este evento se crea después de que el usuario selecciona un elemento de predicción con PlaceAutocompleteElement. Accede a la selección con event.placePrediction.

Llama a PlacePrediction.toPlace para convertir placePrediction en un Place.

Esta clase extiende Event.

Llama al const {PlacePredictionSelectEvent} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
placePrediction
Para convertirlo en un Place, llama a PlacePrediction.toPlace.

Clase PlaceAutocompleteRequestErrorEvent

Clase google.maps.places.PlaceAutocompleteRequestErrorEvent

El evento se emite desde PlaceAutocompleteElement cuando hay un problema con la solicitud de red.

Esta clase extiende Event.

Llama al const {PlaceAutocompleteRequestErrorEvent} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.

Clase PlaceContextualElement

Clase google.maps.places.PlaceContextualElement

Es un widget que usa el token de contexto para mostrar una vista contextual de la respuesta de Grounding con Google Maps.

Elemento personalizado:
<gmp-place-contextual context-token="string"></gmp-place-contextual>

Esta clase extiende HTMLElement.

Esta clase implementa PlaceContextualElementOptions.

Llama al const {PlaceContextualElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
PlaceContextualElement
PlaceContextualElement([options])
Parámetros: 
contextToken
Tipo:  string optional
Es el token de contexto.
Atributo HTML:
  • <gmp-place-contextual context-token="string"></gmp-place-contextual>
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.

Interfaz de PlaceContextualElementOptions

Interfaz de google.maps.places.PlaceContextualElementOptions

Opciones para PlaceContextualElement.
contextToken optional
Tipo:  string optional
Es el token de contexto que proporciona la respuesta de Fundamentación con Google Maps.

Clase PlaceContextualListConfigElement

Clase google.maps.places.PlaceContextualListConfigElement

Es un elemento HTML que configura opciones para la vista de lista del elemento contextual de lugar.

Elemento personalizado:
<gmp-place-contextual-list-config layout="compact" map-hidden map-mode="none"></gmp-place-contextual-list-config>

Esta clase extiende HTMLElement.

Esta clase implementa PlaceContextualListConfigElementOptions.

Llama al const {PlaceContextualListConfigElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
PlaceContextualListConfigElement
PlaceContextualListConfigElement([options])
Parámetros: 
layout
Tipo:  PlaceContextualListLayout optional
Es el diseño.
Atributo HTML:
  • <gmp-place-contextual-list-config layout="compact"></gmp-place-contextual-list-config>
  • <gmp-place-contextual-list-config layout="vertical"></gmp-place-contextual-list-config>
mapHidden
Tipo:  boolean optional
Indica si el mapa está oculto.
Atributo HTML:
  • <gmp-place-contextual-list-config map-hidden></gmp-place-contextual-list-config>
mapMode
Es el modo de mapa que se usa en el elemento contextual de lugar para una lista de lugares.
Atributo HTML:
  • <gmp-place-contextual-list-config map-mode="none"></gmp-place-contextual-list-config>
  • <gmp-place-contextual-list-config map-mode="roadmap"></gmp-place-contextual-list-config>
  • <gmp-place-contextual-list-config map-mode="hybrid"></gmp-place-contextual-list-config>
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.

Interfaz PlaceContextualListConfigElementOptions

Interfaz de google.maps.places.PlaceContextualListConfigElementOptions

Son las opciones de PlaceContextualListConfigElement.
layout optional
Tipo:  PlaceContextualListLayout optional
Predeterminado: PlaceContextualListLayout.VERTICAL
Es el diseño.
mapHidden optional
Tipo:  boolean optional
Predeterminado: false
Es verdadero si se debe ocultar el mapa.
mapMode optional
Predeterminado: PlaceContextualListMapMode.ROADMAP
Es el modo de mapa que se usa en el elemento contextual de lugar para una lista de lugares.

Constantes de PlaceContextualListLayout

Constantes de google.maps.places.PlaceContextualListLayout

Es la lista de diseños que admite el elemento contextual de lugar para la vista de lista.

Llama al const {PlaceContextualListLayout} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
COMPACT Diseño de lista compacto: Los elementos de la lista se renderizan como vínculos en una sola línea, con desbordamientos en una lista desplegable.
VERTICAL Diseño de lista vertical: Los elementos de la lista se renderizan como tarjetas en una lista vertical.

Constantes de PlaceContextualListMapMode

Constantes de google.maps.places.PlaceContextualListMapMode

Es el modo de mapa que se usa en el elemento contextual de lugar para una lista de lugares.

Llama al const {PlaceContextualListMapMode} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
HYBRID Una capa transparente de las calles principales en imágenes satelitales o fotorrealistas en 3D
NONE No hay mapa.
ROADMAP Un mapa de calles normal en 2D.

Clase PlaceDetailsElement

Clase google.maps.places.PlaceDetailsElement

Muestra los detalles de un lugar en un diseño completo. Agrega PlaceDetailsPlaceRequestElement o PlaceDetailsLocationRequestElement para especificar el lugar que se renderizará. Agrega un PlaceContentConfigElement, PlaceStandardContentElement o PlaceAllContentElement para especificar qué contenido se debe renderizar.

Ejemplo: 

 <gmp-place-details>
   <gmp-place-details-place-request
     place="PLACE_ID"
   ></gmp-place-details-place-request>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </gmp-place-content-config>
 </gmp-place-details>

Para usar este elemento, habilita la API de Places UI Kit para tu proyecto en la consola de Google Cloud.

Elemento personalizado:
<gmp-place-details></gmp-place-details>

Esta clase extiende HTMLElement.

Esta clase implementa PlaceDetailsElementOptions.

Llama al const {PlaceDetailsElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
PlaceDetailsElement
PlaceDetailsElement([options])
Parámetros: 
place
Tipo:  Place optional
Solo lectura. Objeto Place que contiene el ID, la ubicación y el viewport del lugar renderizado actualmente.
--gmp-button-border-color
Color del borde del botón "Abrir en Maps".
--gmp-button-border-radius
Radio del borde del botón "Abrir en Maps".
--gmp-button-border-width
Ancho del borde del botón "Abrir en Maps".
--gmp-collage-border-radius-outer
Radio del borde de las esquinas exteriores del collage de medios.
--gmp-dialog-border-radius
Radio del borde del diálogo de divulgación de Google Maps.
--gmp-mat-color-disabled-surface
Color de superficie que se usa para transmitir estados inhabilitados o no presentes. Se usa para las estrellas de opinión vacías.
--gmp-mat-color-info
Color de los elementos de la IU con un sentimiento informativo. Se usa para el ícono de silla de ruedas.
--gmp-mat-color-negative
Color de los elementos de la IU con opinión negativa. Se usa para el texto "Cerrado" en el estado de apertura.
--gmp-mat-color-neutral-container
Color del contenedor para elementos de la IU completados neutros. Se usa para los marcadores de posición de imágenes y la insignia de fecha de publicación de la revisión.
--gmp-mat-color-on-neutral-container
Color del texto y los íconos sobre el color del contenedor neutro. Se usa para la insignia de fecha de publicación de la opinión y la insignia de disponibilidad del cargador de VE cuando no está disponible.
--gmp-mat-color-on-positive-container
Color de los textos y los íconos en contraste con el color del contenedor positivo. Se usa para la insignia de disponibilidad del cargador de VE cuando está disponible.
--gmp-mat-color-on-secondary-container
Color del texto y los íconos sobre el color del contenedor secundario. Se usa para el texto y los íconos del botón "Abrir en Maps".
--gmp-mat-color-on-surface
Color para el texto y los íconos sobre cualquier color de superficie. Se usa para texto normal.
--gmp-mat-color-on-surface-variant
Color de menor énfasis para el texto y los íconos sobre cualquier color de superficie. Se usa para texto menos enfatizado.
--gmp-mat-color-outline-decorative
Color de contorno de los elementos no interactivos. Se usa para el borde del elemento.
--gmp-mat-color-positive
Color de los elementos de la IU con opinión positiva. Se usa para el texto "Abierto" en el estado de apertura actual.
--gmp-mat-color-positive-container
Color del contenedor para los elementos de la IU que transmiten una opinión positiva. Se usa para la insignia de disponibilidad del cargador de VE cuando está disponible.
--gmp-mat-color-primary
Color de los íconos y el texto interactivos en relación con el color de la superficie. Se usa para el recuento de opiniones, los vínculos en el diálogo de divulgaciones de Google Maps, el vínculo al sitio web, los íconos en la pestaña de resumen y (color de texto, enfoque o desplazamiento del mouse) en los títulos de la barra de pestañas.
--gmp-mat-color-secondary-container
Color de relleno menos destacado en comparación con la superficie, para componentes recesivos, como los botones tonales. Se usa para el fondo del botón "Abrir en Maps".
--gmp-mat-color-surface
Color para los fondos. Se usa para los fondos del elemento y el diálogo de divulgaciones de Google Maps.
--gmp-mat-font-body-medium
Se usa para la dirección, la calificación, el tipo, el precio, el estado de apertura, el horario de atención, la opinión, el número de teléfono, el sitio web, el código plus, las funciones principales y el texto del cuerpo del diálogo de divulgaciones de Google Maps del lugar.
--gmp-mat-font-body-small
Se usa para el texto del cuerpo en la lista de funciones de la pestaña "Acerca de".
--gmp-mat-font-display-small
Se usa para el nombre del lugar y el texto de cada encabezado de la función en la pestaña "Acerca de".
--gmp-mat-font-family
Es la familia de fuentes base que se usa para todo el texto.
--gmp-mat-font-headline-medium
Se usa para el texto del encabezado en el diálogo de divulgaciones de Google Maps.
--gmp-mat-font-label-large
Se usa para los títulos de las pestañas, el botón "Abrir en Maps", el texto de atribución del revisor en la galería de fotos, el texto de atribución del revisor en la sección de opiniones y los vínculos en el diálogo de divulgaciones de Google Maps.
--gmp-mat-font-label-medium
Se usa para la insignia de recuento de fotos y la insignia de fecha de publicación de la opinión.
--gmp-mat-font-title-small
Se usa para el título de cada sección de la pestaña "Acerca de".
--gmp-mat-spacing-extra-large
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-extra-small
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-large
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-medium
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-small
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-two-extra-large
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-star-rating-color
Color de las estrellas completas en la calificación.
background-color
Anula el color de fondo del elemento.
border
Anula el borde del elemento.
border-radius
Anula el radio del borde del elemento.
color-scheme
Indica con qué esquema de color se puede renderizar este elemento. Consulta la documentación de color-scheme para obtener más detalles. La configuración predeterminada es color-scheme: light dark.
font-size
Ajusta el tamaño de todo el texto y los íconos del elemento, que se definen internamente en ems. La configuración predeterminada es 16px.
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.
gmp-error
function(event)
Argumentos: 
Este evento se activa cuando se rechaza una solicitud al backend (p.ej., clave de API incorrecta). Este evento no se propaga.
gmp-load
function(event)
Argumentos: 
Este evento se activa cuando el elemento carga y renderiza su contenido. Este evento no se propaga.

Interfaz PlaceDetailsElementOptions

Interfaz de google.maps.places.PlaceDetailsElementOptions

Opciones para PlaceDetailsElement.

Clase PlaceDetailsCompactElement

Clase google.maps.places.PlaceDetailsCompactElement

Muestra los detalles de un lugar en un diseño compacto. Agrega un PlaceDetailsPlaceRequestElement o PlaceDetailsLocationRequestElement para especificar el lugar que se renderizará. Agrega un PlaceContentConfigElement, PlaceStandardContentElement o PlaceAllContentElement para especificar qué contenido se debe renderizar.

Ejemplo: 

 <gmp-place-details-compact>
   <gmp-place-details-place-request
     place="PLACE_ID"
   ></gmp-place-details-place-request>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </gmp-place-content-config>
 </gmp-place-details-compact>

Para usar este elemento, habilita la API de Places UI Kit para tu proyecto en la consola de Google Cloud.

Elemento personalizado:
<gmp-place-details-compact orientation="vertical" truncation-preferred></gmp-place-details-compact>

Esta clase extiende HTMLElement.

Esta clase implementa PlaceDetailsCompactElementOptions.

Llama al const {PlaceDetailsCompactElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
PlaceDetailsCompactElement
PlaceDetailsCompactElement([options])
Parámetros: 
orientation
Tipo:  PlaceDetailsOrientation optional
Predeterminado: PlaceDetailsOrientation.VERTICAL
Es la variante de orientación (vertical u horizontal) del elemento.
Atributo HTML:
  • <gmp-place-details-compact orientation="vertical"></gmp-place-details-compact>
  • <gmp-place-details-compact orientation="horizontal"></gmp-place-details-compact>
place
Tipo:  Place optional
Solo lectura. Objeto Place que contiene el ID, la ubicación y el viewport del lugar renderizado actualmente.
truncationPreferred
Tipo:  boolean
Predeterminado: false
Si es verdadero, trunca el nombre y la dirección del lugar para que quepan en una sola línea en lugar de ajustarse.
Atributo HTML:
  • <gmp-place-details-compact truncation-preferred></gmp-place-details-compact>
--gmp-button-border-color
Color del borde del botón "Abrir en Maps".
--gmp-button-border-radius
Radio del borde del botón "Abrir en Maps".
--gmp-button-border-width
Ancho del borde del botón "Abrir en Maps".
--gmp-dialog-border-radius
Radio del borde del diálogo de divulgación de Google Maps.
--gmp-mat-color-info
Color de los elementos de la IU con un sentimiento informativo. Se usa para el ícono de silla de ruedas.
--gmp-mat-color-negative
Color de los elementos de la IU con opinión negativa. Se usa para el texto "Cerrado" en el estado de apertura.
--gmp-mat-color-neutral-container
Color del contenedor para elementos de la IU completados neutros. Se usa para los marcadores de posición de imágenes.
--gmp-mat-color-on-secondary-container
Color del texto y los íconos sobre el color del contenedor secundario. Se usa para el texto y los íconos del botón "Abrir en Maps".
--gmp-mat-color-on-surface
Color para el texto y los íconos sobre cualquier color de superficie. Se usa para texto normal.
--gmp-mat-color-on-surface-variant
Color de menor énfasis para el texto y los íconos sobre cualquier color de superficie. Se usa para texto menos enfatizado.
--gmp-mat-color-outline-decorative
Color de contorno de los elementos no interactivos. Se usa para el borde del elemento.
--gmp-mat-color-positive
Color de los elementos de la IU con opinión positiva. Se usa para el texto "Abierto" en el estado de apertura actual.
--gmp-mat-color-primary
Color de los íconos y el texto interactivos en relación con el color de la superficie. Se usa para el recuento de opiniones y los vínculos en el diálogo de divulgaciones de Google Maps.
--gmp-mat-color-secondary-container
Color de relleno menos destacado en comparación con la superficie, para componentes recesivos, como los botones tonales. Se usa para el fondo del botón "Abrir en Maps".
--gmp-mat-color-surface
Color para los fondos. Se usa para los fondos del elemento y el diálogo de divulgaciones de Google Maps.
--gmp-mat-font-body-medium
Se usa para el texto del cuerpo en el diálogo de divulgaciones de Google Maps.
--gmp-mat-font-body-small
Se usa para la dirección, la calificación, el tipo, el precio y el estado de apertura actual del lugar.
--gmp-mat-font-family
Es la familia de fuentes base que se usa para todo el texto.
--gmp-mat-font-headline-medium
Se usa para el texto del encabezado en el diálogo de divulgaciones de Google Maps.
--gmp-mat-font-label-large
Se usa para el botón "Abrir en Maps", así como para los vínculos en el diálogo de divulgaciones de Google Maps y el texto de atribución del revisor en la galería de fotos.
--gmp-mat-font-label-medium
Se usa para la insignia de recuento de fotos.
--gmp-mat-font-title-small
Se usa para el nombre del lugar.
--gmp-mat-spacing-extra-small
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-large
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-medium
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-small
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-star-rating-color
Color de las estrellas completas en la calificación.
--gmp-thumbnail-border-radius
Radio del borde de la imagen en miniatura del lugar.
background-color
Anula el color de fondo del elemento.
border
Anula el borde del elemento.
border-radius
Anula el radio del borde del elemento.
color-scheme
Indica con qué esquema de color se puede renderizar este elemento. Consulta la documentación de color-scheme para obtener más detalles. La configuración predeterminada es color-scheme: light dark.
font-size
Ajusta el tamaño de todo el texto y los íconos del elemento, que se definen internamente en ems. La configuración predeterminada es 16px.
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.
gmp-error
function(event)
Argumentos: 
Este evento se activa cuando se rechaza una solicitud al backend (p.ej., clave de API incorrecta). Este evento no se propaga.
gmp-load
function(event)
Argumentos: 
Este evento se activa cuando el elemento carga y renderiza su contenido. Este evento no se propaga.

Interfaz de PlaceDetailsCompactElementOptions

Interfaz de google.maps.places.PlaceDetailsCompactElementOptions

Opciones para PlaceDetailsCompactElement.
orientation optional
Tipo:  PlaceDetailsOrientation optional
Consulta los PlaceDetailsCompactElement.orientation.
truncationPreferred optional
Tipo:  boolean optional
Consulta los PlaceDetailsCompactElement.truncationPreferred.

Constantes de PlaceDetailsOrientation

Constantes de google.maps.places.PlaceDetailsOrientation

Son las variantes de orientación para PlaceDetailsCompactElement.

Llama al const {PlaceDetailsOrientation} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
HORIZONTAL Orientación horizontal.
VERTICAL Orientación vertical.

Clase PlaceDetailsPlaceRequestElement

Clase google.maps.places.PlaceDetailsPlaceRequestElement

Configura un PlaceDetailsCompactElement o un PlaceDetailsElement para cargar datos basados en un objeto de lugar, un ID o un nombre de recurso. Agrega este elemento como secundario de un PlaceDetailsCompactElement o PlaceDetailsElement para cargar datos del lugar especificado. Por ejemplo: 

 <gmp-place-details>
   <gmp-place-details-place-request
     place="PLACE_ID"
   ></gmp-place-details-place-request>
 </gmp-place-details>

Elemento personalizado:
<gmp-place-details-place-request place="some-place-id"></gmp-place-details-place-request>

Esta clase extiende HTMLElement.

Esta clase implementa PlaceDetailsPlaceRequestElementOptions.

Llama al const {PlaceDetailsPlaceRequestElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
PlaceDetailsPlaceRequestElement
PlaceDetailsPlaceRequestElement([options])
Parámetros: 
place
Tipo:  Place optional
Predeterminado: null
Es el objeto, el ID o el nombre del recurso del lugar para el que se renderizarán los detalles en el elemento compacto de Place Details. Esta propiedad se refleja en el atributo como un nombre de recurso.
Atributo HTML:
  • <gmp-place-details-place-request place="some-place-id"></gmp-place-details-place-request>
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.

Interfaz de PlaceDetailsPlaceRequestElementOptions

Interfaz de google.maps.places.PlaceDetailsPlaceRequestElementOptions

Opciones para PlaceDetailsPlaceRequestElement.
place optional
Tipo:  Place|string optional
Ver PlaceDetailsPlaceRequestElement.place

Clase PlaceDetailsLocationRequestElement

Clase google.maps.places.PlaceDetailsLocationRequestElement

Configura un PlaceDetailsCompactElement o un PlaceDetailsElement para cargar datos según una ubicación. Agrega este elemento como secundario de un PlaceDetailsCompactElement o PlaceDetailsElement para cargar datos de la ubicación especificada. Por ejemplo: 

 <gmp-place-details>
   <gmp-place-details-location-request
     location="37.6207665,-122.4284806"
   ></gmp-place-details-location-request>
 </gmp-place-details>

Elemento personalizado:
<gmp-place-details-location-request location="lat,lng"></gmp-place-details-location-request>

Esta clase extiende HTMLElement.

Esta clase implementa PlaceDetailsLocationRequestElementOptions.

Llama al const {PlaceDetailsLocationRequestElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
PlaceDetailsLocationRequestElement
PlaceDetailsLocationRequestElement([options])
Parámetros: 
location
Predeterminado: null
Es la ubicación para la que se renderizarán los detalles en el elemento Place Details. Se normaliza a un LatLngAltitude.
Atributo HTML:
  • <gmp-place-details-location-request location="lat,lng"></gmp-place-details-location-request>
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.

Interfaz PlaceDetailsLocationRequestElementOptions

Interfaz de google.maps.places.PlaceDetailsLocationRequestElementOptions

Opciones para PlaceDetailsLocationRequestElement.
location optional
Es la ubicación en la que se renderizará el lugar.

Clase PlaceSearchElement

Clase google.maps.places.PlaceSearchElement

Muestra los resultados de una búsqueda de lugares en una lista. Agrega un PlaceTextSearchRequestElement o un PlaceNearbySearchRequestElement para especificar la solicitud para la que se deben renderizar los resultados. Agrega un PlaceContentConfigElement, PlaceStandardContentElement o PlaceAllContentElement para especificar qué contenido se debe renderizar.

Ejemplo: 

 <gmp-place-search>
   <gmp-place-text-search-request
     text-query="QUERY"
   ></gmp-place-text-search-request>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </gmp-place-content-config>
 </gmp-place-search>

Para usar el elemento Place Search, habilita la API de Places UI Kit para tu proyecto en la consola de Google Cloud.

Elemento personalizado:
<gmp-place-search attribution-position="top" orientation="vertical" selectable truncation-preferred></gmp-place-search>

Esta clase extiende HTMLElement.

Esta clase implementa PlaceSearchElementOptions.

Llama al const {PlaceSearchElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
PlaceSearchElement
PlaceSearchElement([options])
Parámetros: 
attributionPosition
Predeterminado: PlaceSearchAttributionPosition.TOP
Posición del logotipo de atribución y el botón de divulgación legal.
Atributo HTML:
  • <gmp-place-search attribution-position="top"></gmp-place-search>
  • <gmp-place-search attribution-position="bottom"></gmp-place-search>
orientation
Tipo:  PlaceSearchOrientation optional
Predeterminado: PlaceSearchOrientation.VERTICAL
Es la variante de orientación (vertical u horizontal) del elemento.
Atributo HTML:
  • <gmp-place-search orientation="vertical"></gmp-place-search>
  • <gmp-place-search orientation="horizontal"></gmp-place-search>
places
Tipo:  Array<Place>
Solo lectura. Es un array de objetos Place que contiene los IDs, las ubicaciones y los viewport de los lugares renderizados actualmente.
selectable
Tipo:  boolean optional
Predeterminado: false
Indica si los elementos de la lista se pueden seleccionar o no. Si es verdadero, los elementos de la lista serán botones que envían el evento gmp-select cuando se hace clic en ellos. También se admite la navegación y selección accesibles con el teclado.
Atributo HTML:
  • <gmp-place-search selectable></gmp-place-search>
truncationPreferred
Tipo:  boolean optional
Predeterminado: false
Si es verdadero, trunca ciertas líneas de contenido para que quepan en una sola línea en lugar de ajustarse.
Atributo HTML:
  • <gmp-place-search truncation-preferred></gmp-place-search>
--gmp-button-border-color
Color del borde del botón "Abrir en Maps".
--gmp-button-border-radius
Radio del borde del botón "Abrir en Maps".
--gmp-button-border-width
Ancho del borde del botón "Abrir en Maps".
--gmp-card-border-radius
Radio del borde de las tarjetas de lugar.
--gmp-dialog-border-radius
Radio del borde del diálogo de divulgación de Google Maps.
--gmp-mat-color-info
Color de los elementos de la IU con un sentimiento informativo. Se usa para el ícono de entrada accesible.
--gmp-mat-color-negative
Color de los elementos de la IU con opinión negativa. Se usa para la etiqueta "Cerrado" del horario de atención de un lugar.
--gmp-mat-color-neutral-container
Color del contenedor para elementos de la IU completados neutros. Se usa para las insignias de fecha de revisión y las formas de marcadores de posición de carga.
--gmp-mat-color-on-neutral-container
Color del texto y los íconos en un contenedor neutro. Se usa para el texto de la fecha de revisión y el texto del error de carga.
--gmp-mat-color-on-secondary-container
Color del texto y los íconos sobre un color de contenedor secundario. Se usa para el texto y los íconos de los botones.
--gmp-mat-color-on-surface
Color para el texto y los íconos sobre un color de superficie. Se usa para encabezados y contenido de diálogos.
--gmp-mat-color-on-surface-variant
Color de menor énfasis para el texto y los íconos sobre un color de superficie. Se usa para la información de lugares.
--gmp-mat-color-outline-decorative
Color de contorno de los elementos no interactivos. Se usa para el borde del contenedor.
--gmp-mat-color-positive
Color de los elementos de la IU con opinión positiva. Se usa para la etiqueta "Abierto" del horario de atención de un lugar.
--gmp-mat-color-primary
Color de los íconos y el texto interactivos en relación con el color de la superficie. Se usa para los vínculos, el indicador de carga y los íconos de resumen.
--gmp-mat-color-secondary-container
Color de relleno menos prominente en una superficie. Se usa para los fondos de los botones.
--gmp-mat-color-surface
Color para los fondos. Se usa para los fondos de contenedores y diálogos.
--gmp-mat-font-body-small
Se usa para la información de lugares.
--gmp-mat-font-family
Es la familia de fuentes base para todo el texto.
--gmp-mat-font-headline-medium
Se usa para los encabezados de los diálogos.
--gmp-mat-font-label-large
Se usa para el contenido del botón.
--gmp-mat-font-title-medium
Se usa para el nombre del lugar.
--gmp-mat-spacing-extra-small
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-large
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-medium
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-mat-spacing-small
Se usa para el espaciado dentro del elemento, como el margen y el padding alrededor del texto.
--gmp-star-rating-color
Color de las estrellas completadas en una calificación por estrellas.
--gmp-thumbnail-border-radius
Radio de borde de la imagen en miniatura del lugar.
background-color
Anula el color de fondo del elemento.
border
Anula el borde del elemento.
border-radius
Anula el radio del borde del elemento.
color-scheme
Indica con qué esquema de color se puede renderizar este elemento. Consulta la documentación de color-scheme para obtener más detalles. La configuración predeterminada es color-scheme: light dark.
font-size
Ajusta la escala de todo el texto y los íconos del elemento. La configuración predeterminada es 16px.
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.
gmp-error
function(event)
Argumentos: 
Este evento se activa cuando se rechaza una solicitud al backend (p.ej., clave de API incorrecta). Este evento no se propaga.
gmp-load
function(event)
Argumentos: 
Este evento se activa cuando el elemento carga y renderiza su contenido. Este evento no se propaga.
gmp-select
function(event)
Argumentos: 
Este evento se activa cuando se selecciona un lugar de la lista. Contiene un objeto Place que incluye el ID, la ubicación y la ventana gráfica del lugar seleccionado.

Interfaz de PlaceSearchElementOptions

Interfaz de google.maps.places.PlaceSearchElementOptions

Opciones para PlaceSearchElement.
attributionPosition optional
Consulta los PlaceSearchElement.attributionPosition.
orientation optional
Tipo:  PlaceSearchOrientation optional
Consulta los PlaceSearchElement.orientation.
selectable optional
Tipo:  boolean optional
Ver PlaceSearchElement.selectable
truncationPreferred optional
Tipo:  boolean optional
Consulta los PlaceSearchElement.truncationPreferred.

Constantes de PlaceSearchAttributionPosition

Constantes de google.maps.places.PlaceSearchAttributionPosition

Son las posiciones de atribución para PlaceSearchElement.

Llama al const {PlaceSearchAttributionPosition} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
BOTTOM Atribución en la parte inferior del PlaceSearchElement
TOP Atribución en la parte superior del PlaceSearchElement

Constantes de PlaceSearchOrientation

Constantes de google.maps.places.PlaceSearchOrientation

Son las variantes de orientación para PlaceSearchElement.

Llama al const {PlaceSearchOrientation} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
HORIZONTAL Orientación horizontal.
VERTICAL Orientación vertical.

Clase PlaceSelectEvent

Clase google.maps.places.PlaceSelectEvent

Este evento se activa cuando se selecciona un lugar de una lista de lugares. Accede a la selección con event.place.

Esta clase extiende Event.

Llama al const {PlaceSelectEvent} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
place
Tipo:  Place
Es el lugar seleccionado.

Clase PlaceNearbySearchRequestElement

Clase google.maps.places.PlaceNearbySearchRequestElement

Configura un PlaceSearchElement para cargar resultados según una solicitud de búsqueda cercana. La propiedad locationRestriction es obligatoria para que se cargue el elemento de búsqueda. Se ignorará cualquier otra propiedad configurada si no se establece locationRestriction. Agrega este elemento como secundario de un PlaceSearchElement para cargar los resultados. Por ejemplo: 

 <gmp-place-search>
   <gmp-place-nearby-search-request
     location-restriction="RADIUS@LAT,LNG"
   ></gmp-place-nearby-search-request>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </gmp-place-content-config>
 </gmp-place-search>

Elemento personalizado:
<gmp-place-nearby-search-request excluded-primary-types="excluded-primary-type1 excluded-primary-type2..." excluded-types="excluded-type1 excluded-type2..." included-primary-types="included-primary-type1 included-primary-type2..." included-types="included-type1 included-type2..." location-restriction="radius@lat,lng" max-result-count="number" rank-preference="preference"></gmp-place-nearby-search-request>

Esta clase extiende HTMLElement.

Esta clase implementa PlaceNearbySearchRequestElementOptions.

Llama al const {PlaceNearbySearchRequestElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
PlaceNearbySearchRequestElement
PlaceNearbySearchRequestElement([options])
Parámetros: 
excludedPrimaryTypes
Tipo:  Array<string> optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-nearby-search-request excluded-primary-types="excluded-primary-type1 excluded-primary-type2..."></gmp-place-nearby-search-request>
excludedTypes
Tipo:  Array<string> optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-nearby-search-request excluded-types="excluded-type1 excluded-type2..."></gmp-place-nearby-search-request>
includedPrimaryTypes
Tipo:  Array<string> optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-nearby-search-request included-primary-types="included-primary-type1 included-primary-type2..."></gmp-place-nearby-search-request>
includedTypes
Tipo:  Array<string> optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-nearby-search-request included-types="included-type1 included-type2..."></gmp-place-nearby-search-request>
locationRestriction
Tipo:  Circle|CircleLiteral optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-nearby-search-request location-restriction="radius@lat,lng"></gmp-place-nearby-search-request>
maxResultCount
Tipo:  number optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-nearby-search-request max-result-count="number"></gmp-place-nearby-search-request>
rankPreference
Predeterminado: null
Atributo HTML:
  • <gmp-place-nearby-search-request rank-preference="preference"></gmp-place-nearby-search-request>
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.

PlaceNearbySearchRequestElementOptions (interfaz)

Interfaz de google.maps.places.PlaceNearbySearchRequestElementOptions

Opciones para PlaceNearbySearchRequestElement.
excludedPrimaryTypes optional
Tipo:  Array<string> optional
Son los tipos de lugar principal excluidos. Consulta PlaceNearbySearchRequestElement.excludedPrimaryTypes y SearchNearbyRequest.excludedPrimaryTypes para obtener más información.
excludedTypes optional
Tipo:  Array<string> optional
Son los tipos de lugares excluidos. Consulta PlaceNearbySearchRequestElement.excludedTypes y SearchNearbyRequest.excludedTypes para obtener más información.
includedPrimaryTypes optional
Tipo:  Array<string> optional
Son los tipos de lugares principales incluidos. Consulta PlaceNearbySearchRequestElement.includedPrimaryTypes y SearchNearbyRequest.includedPrimaryTypes para obtener más información.
includedTypes optional
Tipo:  Array<string> optional
Son los tipos de lugares incluidos. Consulta PlaceNearbySearchRequestElement.includedTypes y SearchNearbyRequest.includedTypes para obtener más información.
locationRestriction optional
Tipo:  Circle|CircleLiteral optional
Es la región en la que se realizará la búsqueda. Consulta PlaceNearbySearchRequestElement.locationRestriction y SearchNearbyRequest.locationRestriction para obtener más información.
maxResultCount optional
Tipo:  number optional
Cantidad máxima de resultados que se mostrarán. Consulta PlaceNearbySearchRequestElement.maxResultCount y SearchNearbyRequest.maxResultCount para obtener más información.
rankPreference optional
Indica cómo se clasificarán los resultados en la respuesta. Consulta PlaceNearbySearchRequestElement.rankPreference y SearchNearbyRankPreference para obtener más información.

Clase PlaceTextSearchRequestElement

Clase google.maps.places.PlaceTextSearchRequestElement

Configura un PlaceSearchElement para cargar resultados según una solicitud de búsqueda de texto. La propiedad textQuery es obligatoria para que se cargue el elemento de búsqueda. Se ignorará cualquier otra propiedad configurada si no se establece textQuery. Agrega este elemento como secundario de un PlaceSearchElement para cargar los resultados. Por ejemplo: 

 <gmp-place-search>
   <gmp-place-text-search-request
     text-query="QUERY"
   ></gmp-place-text-search-request>
   <gmp-place-content-config>
     <gmp-place-media lightbox-preferred></gmp-place-media>
   </gmp-place-content-config>
 </gmp-place-search>

Elemento personalizado:
<gmp-place-text-search-request ev-connector-types="ev-connector-type1 ev-connector-type2..." ev-minimum-charging-rate-kw="rate" included-type="type" is-open-now="true" location-bias="lat,lng" location-restriction="swlat,swlng|nelat,nelng" max-result-count="number" min-rating="number" price-levels="price-level1 price-level2..." rank-preference="preference" text-query="string" use-strict-type-filtering></gmp-place-text-search-request>

Esta clase extiende HTMLElement.

Esta clase implementa PlaceTextSearchRequestElementOptions.

Llama al const {PlaceTextSearchRequestElement} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
PlaceTextSearchRequestElement
PlaceTextSearchRequestElement([options])
Parámetros: 
evConnectorTypes
Tipo:  Array<EVConnectorType> optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request ev-connector-types="ev-connector-type1 ev-connector-type2..."></gmp-place-text-search-request>
evMinimumChargingRateKw
Tipo:  number optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request ev-minimum-charging-rate-kw="rate"></gmp-place-text-search-request>
includedType
Tipo:  string optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request included-type="type"></gmp-place-text-search-request>
isOpenNow
Tipo:  boolean optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request is-open-now="true"></gmp-place-text-search-request>
locationBias
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request location-bias="lat,lng"></gmp-place-text-search-request>
  • <gmp-place-text-search-request location-bias="lat,lng[,altitude]"></gmp-place-text-search-request>
  • <gmp-place-text-search-request location-bias="swlat,swlng|nelat,nelng"></gmp-place-text-search-request>
  • <gmp-place-text-search-request location-bias="radius@lat,lng"></gmp-place-text-search-request>
  • <gmp-place-text-search-request location-bias="IP_BIAS"></gmp-place-text-search-request>
locationRestriction
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request location-restriction="swlat,swlng|nelat,nelng"></gmp-place-text-search-request>
maxResultCount
Tipo:  number optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request max-result-count="number"></gmp-place-text-search-request>
minRating
Tipo:  number optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request min-rating="number"></gmp-place-text-search-request>
priceLevels
Tipo:  Array<PriceLevel> optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request price-levels="price-level1 price-level2..."></gmp-place-text-search-request>
rankPreference
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request rank-preference="preference"></gmp-place-text-search-request>
textQuery
Tipo:  string optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request text-query="string"></gmp-place-text-search-request>
useStrictTypeFiltering
Tipo:  boolean optional
Predeterminado: null
Atributo HTML:
  • <gmp-place-text-search-request use-strict-type-filtering></gmp-place-text-search-request>
addEventListener
addEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que distingue mayúsculas de minúsculas y que representa el tipo de evento que se debe escuchar.
  • listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent.
  • options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive.
Valor de devolución:  void
Configura una función que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Parámetros: 
  • type:  string Cadena que especifica el tipo de evento para el que se quitará un objeto de escucha de eventos.
  • listener:  EventListener|EventListenerObject El objeto de escucha de eventos del controlador de eventos que se quitará del destino del evento.
  • options:  boolean|EventListenerOptions optional Consulta las opciones.
Valor de devolución:  void
Quita del destino un objeto de escucha de eventos registrado previamente con addEventListener. Consulta removeEventListener.

Interfaz de PlaceTextSearchRequestElementOptions

Interfaz de google.maps.places.PlaceTextSearchRequestElementOptions

Opciones para PlaceTextSearchRequestElement.
evConnectorTypes optional
Tipo:  Array<EVConnectorType> optional
Es la lista de tipos de conectores de VE preferidos. Consulta SearchByTextRequest.evSearchOptions y PlaceTextSearchRequestElement.evConnectorTypes para obtener más información.
evMinimumChargingRateKw optional
Tipo:  number optional
Es la tasa de carga mínima requerida en kilovatios. Consulta SearchByTextRequest.evSearchOptions y PlaceTextSearchRequestElement.evMinimumChargingRateKw para obtener más información.
includedType optional
Tipo:  string optional
Es el tipo de lugar solicitado. Consulta SearchByTextRequest.includedType y PlaceTextSearchRequestElement.includedType para obtener más información.
isOpenNow optional
Tipo:  boolean optional
Se usa para restringir la búsqueda a los lugares que están abiertos en ese momento. Consulta SearchByTextRequest.isOpenNow y PlaceTextSearchRequestElement.isOpenNow para obtener más información.
locationBias optional
Es la personalización de ubicación para la búsqueda. Consulta SearchByTextRequest.locationBias y PlaceTextSearchRequestElement.locationBias para obtener más información.
locationRestriction optional
Es la restricción de ubicación para la búsqueda. Consulta SearchByTextRequest.locationRestriction y PlaceTextSearchRequestElement.locationRestriction para obtener más información.
maxResultCount optional
Tipo:  number optional
Cantidad máxima de resultados que se mostrarán. Consulta SearchByTextRequest.maxResultCount y PlaceTextSearchRequestElement.maxResultCount para obtener más información.
minRating optional
Tipo:  number optional
Se filtran los resultados cuya calificación promedio del usuario es estrictamente inferior a este límite. Consulta SearchByTextRequest.minRating y PlaceTextSearchRequestElement.minRating para obtener más información.
priceLevels optional
Tipo:  Array<PriceLevel> optional
Se usa para restringir la búsqueda a lugares que están marcados con ciertos niveles de precios. Consulta SearchByTextRequest.priceLevels y PlaceTextSearchRequestElement.priceLevels para obtener más información.
rankPreference optional
Indica cómo se clasificarán los resultados en la respuesta. Consulta SearchByTextRequest.rankPreference y PlaceTextSearchRequestElement.rankPreference para obtener más información.
textQuery optional
Tipo:  string optional
Es la consulta de texto para la búsqueda textual. Consulta SearchByTextRequest.textQuery y PlaceTextSearchRequestElement.textQuery para obtener más información.
useStrictTypeFiltering optional
Tipo:  boolean optional
Se usa para establecer un filtrado de tipos estricto para SearchByTextRequest.includedType. Consulta SearchByTextRequest.useStrictTypeFiltering y PlaceTextSearchRequestElement.useStrictTypeFiltering para obtener más información.

Clase Autocomplete

Clase google.maps.places.Autocomplete

Es un widget que proporciona predicciones de lugares basadas en la entrada de texto de un usuario. Se adjunta a un elemento de entrada de tipo text y escucha la entrada de texto en ese campo. La lista de predicciones se presenta como una lista desplegable y se actualiza a medida que se ingresa texto.

Esta clase extiende MVCObject.

Llama al const {Autocomplete} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
Autocomplete
Autocomplete(inputField[, opts])
Parámetros: 
Crea una instancia nueva de Autocomplete que se adjunta al campo de texto de entrada especificado con las opciones proporcionadas.
getBounds
getBounds()
Parámetros: Ninguno
Valor de devolución:  LatLngBounds|undefined Los límites del ajuste.
Devuelve los límites hacia los que se sesgan las predicciones.
getFields
getFields()
Parámetros: Ninguno
Valor de devolución:  Array<string>|undefined
Devuelve los campos que se incluirán para el lugar en la respuesta de detalles cuando estos se recuperen correctamente. Para obtener una lista de los campos, consulta PlaceResult.
getPlace
getPlace()
Parámetros: Ninguno
Valor de devolución:  PlaceResult Es el lugar seleccionado por el usuario.
Devuelve los detalles del lugar seleccionado por el usuario si se recuperaron correctamente. De lo contrario, devuelve un objeto Place de código auxiliar, con la propiedad name establecida en el valor actual del campo de entrada.
setBounds
setBounds(bounds)
Parámetros: 
Valor de retorno: Ninguno
Establece el área preferida dentro de la cual se devolverán los resultados de Place. Los resultados se personalizan, aunque no de manera exclusiva, conforme a esta área.
setComponentRestrictions
setComponentRestrictions(restrictions)
Parámetros: 
Valor de retorno: Ninguno
Establece las restricciones del componente. Las restricciones de componentes se usan para restringir las predicciones solo a las que se encuentran dentro del componente principal. Por ejemplo, el país.
setFields
setFields(fields)
Parámetros: 
  • fields:  Array<string> optional
Valor de retorno: Ninguno
Establece los campos que se incluirán para el lugar en la respuesta de detalles cuando los detalles se recuperen correctamente. Para obtener una lista de los campos, consulta PlaceResult.
setOptions
setOptions(options)
Parámetros: 
Valor de retorno: Ninguno
setTypes
setTypes(types)
Parámetros: 
  • types:  Array<string> optional Son los tipos de predicciones que se incluirán.
Valor de retorno: Ninguno
Establece los tipos de predicciones que se devolverán. Para conocer los tipos compatibles, consulta la guía para desarrolladores. Si no se especifican tipos, se devolverán todos los tipos.
Heredado: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
place_changed
function()
Argumentos: Ninguno
Este evento se activa cuando un objeto PlaceResult está disponible para un lugar que seleccionó el usuario.
Si el usuario ingresa el nombre de un lugar que no sugirió el control y presiona la tecla Intro, o si falla una solicitud de Place Details, el objeto PlaceResult contiene la entrada del usuario en la propiedad name, sin ninguna otra propiedad definida.

Interfaz de AutocompleteOptions

Interfaz de google.maps.places.AutocompleteOptions

Son las opciones que se pueden establecer en un objeto Autocomplete.
bounds optional
Es el área en la que se buscarán lugares.
componentRestrictions optional
Tipo:  ComponentRestrictions optional
Son las restricciones del componente. Las restricciones de componentes se usan para restringir las predicciones solo a las que se encuentran dentro del componente principal. Por ejemplo, el país.
fields optional
Tipo:  Array<string> optional
Son los campos que se incluirán para el lugar en la respuesta de detalles cuando estos se recuperen correctamente, por los que se facturará. Si se pasa ['ALL'], se mostrarán y se facturarán todos los campos disponibles (esto no se recomienda para las implementaciones de producción). Para obtener una lista de los campos, consulta PlaceResult. Los campos anidados se pueden especificar con rutas de puntos (por ejemplo, "geometry.location"). El valor predeterminado es ['ALL'].
placeIdOnly optional
Tipo:  boolean optional
Indica si se deben recuperar solo los IDs de lugar. El objeto PlaceResult que estará disponible cuando se active el evento place_changed solo tendrá los campos place_id, types y name, con los campos place_id, types y description que devuelve el servicio Autocomplete. Está inhabilitado de forma predeterminada.
strictBounds optional
Tipo:  boolean optional
Es un valor booleano que indica que el widget de Autocomplete solo debe mostrar los lugares que se encuentran dentro de los límites del widget de Autocomplete en el momento en que se envía la búsqueda. Si configuras strictBounds como false (que es el valor predeterminado), los resultados se personalizarán, aunque no de manera exclusiva, conforme a los límites.
types optional
Tipo:  Array<string> optional
Son los tipos de predicciones que se devolverán. Para conocer los tipos compatibles, consulta la guía para desarrolladores. Si no se especifican tipos, se devolverán todos los tipos.

Clase google.maps.places.SearchBox

Es un widget que proporciona predicciones de búsqueda basadas en la entrada de texto de un usuario. Se adjunta a un elemento de entrada de tipo text y escucha la entrada de texto en ese campo. La lista de predicciones se presenta como una lista desplegable y se actualiza a medida que se ingresa texto.

Esta clase extiende MVCObject.

Llama al const {SearchBox} = await google.maps.importLibrary("places") para acceder.
Consulta Bibliotecas en la API de Maps JavaScript.
SearchBox
SearchBox(inputField[, opts])
Parámetros: 
Crea una instancia nueva de SearchBox que se adjunta al campo de texto de entrada especificado con las opciones proporcionadas.
getBounds
getBounds()
Parámetros: Ninguno
Valor de devolución:  LatLngBounds|undefined
Devuelve los límites hacia los que se sesgan las predicciones de la búsqueda.
getPlaces
getPlaces()
Parámetros: Ninguno
Valor de devolución:  Array<PlaceResult>|undefined
Devuelve la búsqueda que seleccionó el usuario para usarla con el evento places_changed.
setBounds
setBounds(bounds)
Parámetros: 
Valor de retorno: Ninguno
Establece la región que se usará para sesgar las predicciones de búsqueda. Los resultados solo se personalizarán para esta área y no se restringirán por completo a ella.
Heredado: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
places_changed
function()
Argumentos: Ninguno
Este evento se activa cuando el usuario selecciona una búsqueda. Se debe usar getPlaces para obtener lugares nuevos.

Interfaz de SearchBoxOptions

Interfaz de google.maps.places.SearchBoxOptions

Son las opciones que se pueden establecer en un objeto SearchBox.
bounds optional
Es el área hacia la que se sesgan las predicciones de la búsqueda. Las predicciones se personalizan, aunque no de manera exclusiva, conforme a las búsquedas que se dirigen a estos límites.