Places Widgets

Classe PlaceAutocompleteElement

Classe google.maps.places.PlaceAutocompleteElement

PlaceAutocompleteElement é uma subclasse HTMLElement que fornece um componente de interface para a API Places Autocomplete.

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

Essa classe estende HTMLElement.

Essa classe implementa PlaceAutocompleteElementOptions.

Acesse ligando para const {PlaceAutocompleteElement} = await google.maps.importLibrary("places").
Consulte Bibliotecas na API Maps JavaScript.
PlaceAutocompleteElement
PlaceAutocompleteElement(options)
Parâmetros:
AlphaincludedPrimaryTypes
Tipo:Array<string> optional
Incluído o Tipo de lugar principal (por exemplo, "restaurant" ou "gas_station").

Um lugar só será retornado se o tipo principal dele estiver incluído nessa lista. É possível especificar até cinco valores. Se nenhum tipo for especificado, todos os tipos de lugar serão retornados.
Atributo HTML:
  • <gmp-place-autocomplete included-primary-types="type1 type2 type3..."></gmp-place-autocomplete>
AlphaincludedRegionCodes
Tipo:Array<string> optional
Inclui apenas resultados nas regiões especificadas, que podem ser até 15 códigos de região de dois caracteres do CLDR. Um conjunto vazio não restringe os resultados. Se locationRestriction e includedRegionCodes estiverem definidos, os resultados vão estar na área de interseção.
Atributo HTML:
  • <gmp-place-autocomplete included-region-codes="c1 c2 c3..."></gmp-place-autocomplete>
locationBias
Tipo:LocationBias optional
Um limite ou dica flexível a ser usado ao pesquisar lugares.
locationRestriction
Tipo:LocationRestriction optional
Limites para restringir os resultados da pesquisa.
name
Tipo:string optional
O nome a ser usado para o elemento de entrada. Consulte https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name (link em inglês) para mais detalhes. Segue o mesmo comportamento do atributo "name" para entradas. Esse é o nome que será usado quando um formulário for enviado. Consulte https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form (link em inglês) para mais detalhes.
Atributo HTML:
  • <gmp-place-autocomplete name="string"></gmp-place-autocomplete>
Alphaorigin
A origem de onde calcular a distância. Se não for especificada, a distância não será calculada. A altitude, se fornecida, não é usada no cálculo.
Atributo HTML:
  • <gmp-place-autocomplete origin="lat,lng|lat,lng,altitude"></gmp-place-autocomplete>
requestedLanguage
Tipo:string optional
Um identificador do idioma em que os resultados devem ser retornados, se possível. Os resultados no idioma selecionado podem receber uma classificação mais alta, mas as sugestões não são restritas a esse idioma. Consulte a lista de idiomas compatíveis.
Atributo HTML:
  • <gmp-place-autocomplete requested-language="string"></gmp-place-autocomplete>
requestedRegion
Tipo:string optional
Um código de região usado para formatação e filtragem de resultados. Ele não restringe as sugestões a esse país. O código regional aceita um valor de dois caracteres ccTLD ("domínio de nível superior"). A maioria dos códigos ccTLD é idêntica aos códigos ISO 3166-1, com algumas exceções notáveis. Por exemplo, o ccTLD do Reino Unido é "uk" (.co.uk), enquanto o código ISO 3166-1 é "gb" (tecnicamente para a entidade "Reino Unido da Grã-Bretanha e Irlanda do Norte").
Atributo HTML:
  • <gmp-place-autocomplete requested-region="string"></gmp-place-autocomplete>
AlphaunitSystem
Tipo:UnitSystem optional
O sistema de unidades usado para mostrar distâncias. Se não for especificado, o sistema de unidades será determinado por "requestedRegion".
Atributo HTML:
  • <gmp-place-autocomplete unit-system="metric|imperial"></gmp-place-autocomplete>
BetacomponentRestrictions
Tipo:ComponentRestrictions optional
As restrições de componentes. As restrições de componente são usadas para restringir as previsões apenas àquelas dentro do componente principal. Por exemplo, o país.
Betatypes
Tipo:Array<string> optional
Os tipos de previsões a serem retornadas. Para saber os tipos compatíveis, consulte o guia do desenvolvedor. Se nenhum tipo for especificado, todos serão retornados.
Atributo HTML:
  • <gmp-place-autocomplete types="type1 type2 type3..."></gmp-place-autocomplete>
prediction-item
Um item no menu suspenso de previsões que representa uma única previsão.
prediction-item-icon
O ícone exibido à esquerda de cada item na lista de previsões.
prediction-item-main-text
Uma parte do item de previsão que é o texto principal da previsão. Para localizações geográficas, este item contém o nome de um lugar, como "São Paulo", ou o nome de uma rua e o número, como 'Avenida Paulista, 2013'. Por padrão, o texto principal do item de previsão é preto. Se houver outro texto no prediction-item, ele vai estar fora de prediction-item-main-text e herdar o estilo de prediction-item. A cor padrão é cinza. Normalmente, o texto adicional é um endereço.
prediction-item-match
A parte da previsão retornada que corresponde à entrada do usuário. Por padrão, esse texto correspondido é destacado com texto em negrito. O texto correspondente pode estar em qualquer lugar em prediction-item. Ele não necessariamente faz parte de prediction-item-main-text.
prediction-item-selected
O item quando o usuário navega até ele usando o teclado. Observação: os itens selecionados serão afetados por esses estilos de parte e também pelos estilos de parte do item de previsão.
prediction-list
O elemento visual contendo a lista de previsões retornadas pelo serviço Place Autocomplete. Ela aparece como uma lista suspensa abaixo do PlaceAutocompleteElement.
BetaaddEventListener
addEventListener(type, listener[, options])
Parâmetros:
  • type:  string uma string que diferencia maiúsculas de minúsculas e representa o tipo de evento a ser detectado.
  • listener:  EventListener|EventListenerObject o objeto que recebe uma notificação. Precisa ser uma função ou um objeto com o método handleEvent.
  • options:  boolean|AddEventListenerOptions optional consulte opções. Os eventos personalizados só são compatíveis com capture e passive.
Valor de retorno:void
Configura uma função que será chamada sempre que o evento especificado for entregue ao destino. Consulte addEventListener.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parâmetros:
  • type:  string uma string que especifica o tipo de evento para o qual um listener de eventos será removido.
  • listener:  EventListener|EventListenerObject o listener de eventos do manipulador de eventos a ser removido do destino do evento.
  • options:  boolean|EventListenerOptions optional consulte opções.
Valor de retorno:void
Remove do destino um listener de eventos registrado anteriormente com addEventListener. Consulte removeEventListener.
gmp-error
function(errorEvent)
Argumentos: 
Esse evento é disparado quando uma solicitação ao back-end é negada (por exemplo, chave de API incorreta). Esse evento não é propagado.
gmp-select
function(placePredictionSelectEvent)
Argumentos: 
Esse evento é acionado quando um usuário seleciona uma previsão de lugar. Contém um objeto PlacePrediction que pode ser convertido em um objeto Place.
gmp-placeselect
function(placeAutocompletePlaceSelectEvent)
Argumentos: 
Esse evento é acionado quando um usuário seleciona uma previsão de lugar. Contém um objeto Place.

Interface PlaceAutocompleteElementOptions

Interface google.maps.places.PlaceAutocompleteElementOptions

Opções para construir um PlaceAutocompleteElement. Para a descrição de cada propriedade, consulte a propriedade com o mesmo nome na classe PlaceAutocompleteElement.
BetacomponentRestrictions optional
Tipo:ComponentRestrictions optional
AlphaincludedPrimaryTypes optional
Tipo:Array<string> optional
AlphaincludedRegionCodes optional
Tipo:Array<string> optional
locationBias optional
Tipo:LocationBias optional
locationRestriction optional
Tipo:LocationRestriction optional
name optional
Tipo:string optional
Alphaorigin optional
requestedLanguage optional
Tipo:string optional
Betatypes optional
Tipo:Array<string> optional
AlphaunitSystem optional
Tipo:UnitSystem optional

Classe PlaceAutocompletePlaceSelectEvent

Classe google.maps.places.PlaceAutocompletePlaceSelectEvent

Esse evento é criado depois que o usuário seleciona um lugar com o elemento Place Autocomplete. Acesse a seleção com event.place.

Essa classe estende Event.

Acesse ligando para const {PlaceAutocompletePlaceSelectEvent} = await google.maps.importLibrary("places").
Consulte Bibliotecas na API Maps JavaScript.
Betaplace
Tipo:Place

Classe PlacePredictionSelectEvent

Classe google.maps.places.PlacePredictionSelectEvent

Esse evento é criado depois que o usuário seleciona um item de previsão com o PlaceAutocompleteElement. Acesse a seleção com event.placePrediction.

Essa classe estende Event.

Acesse ligando para const {PlacePredictionSelectEvent} = await google.maps.importLibrary("places").
Consulte Bibliotecas na API Maps JavaScript.
placePrediction

Classe PlaceAutocompleteRequestErrorEvent

Classe google.maps.places.PlaceAutocompleteRequestErrorEvent

Esse evento é emitido pelo PlaceAutocompleteElement quando há um problema com a solicitação de rede.

Essa classe estende Event.

Acesse ligando para const {PlaceAutocompleteRequestErrorEvent} = await google.maps.importLibrary("places").
Consulte Bibliotecas na API Maps JavaScript.

Classe PlaceDetailsElement

Classe google.maps.places.PlaceDetailsElement

Um elemento HTML que mostra detalhes de um lugar. Use os métodos configureFromPlace() ou configureFromLocation() para especificar o conteúdo a ser renderizado. Para usar o elemento de detalhes do lugar, ative a API Places UI Kit no seu projeto no console do Google Cloud.

Elemento personalizado:
<gmp-place-details size="small"></gmp-place-details>

Essa classe estende HTMLElement.

Essa classe implementa PlaceDetailsElementOptions.

Acesse ligando para const {PlaceDetailsElement} = await google.maps.importLibrary("places").
Consulte Bibliotecas na API Maps JavaScript.
PlaceDetailsElement
PlaceDetailsElement([options])
Parâmetros:
place
Tipo:Place optional
Somente leitura. Objeto Place que contém o ID, a localização e a janela de visualização do lugar renderizado no momento.
size
Tipo:PlaceDetailsSize optional
A variante de tamanho do PlaceDetailsElement. Por padrão, o elemento vai mostrar PlaceDetailsSize.X_LARGE.
Atributo HTML:
  • <gmp-place-details size="small"></gmp-place-details>
  • <gmp-place-details size="medium"></gmp-place-details>
  • <gmp-place-details size="large"></gmp-place-details>
  • <gmp-place-details size="x-large"></gmp-place-details>
BetaaddEventListener
addEventListener(type, listener[, options])
Parâmetros:
  • type:  string uma string que diferencia maiúsculas de minúsculas e representa o tipo de evento a ser detectado.
  • listener:  EventListener|EventListenerObject o objeto que recebe uma notificação. Precisa ser uma função ou um objeto com o método handleEvent.
  • options:  boolean|AddEventListenerOptions optional consulte opções. Os eventos personalizados só são compatíveis com capture e passive.
Valor de retorno:void
Configura uma função que será chamada sempre que o evento especificado for entregue ao destino. Consulte addEventListener.
configureFromLocation
configureFromLocation(location)
Parâmetros:
Valor de retorno:Promise<void> uma promessa que é resolvida quando os dados de lugar são carregados e renderizados.
Configura o widget de um LatLng usando a geocodificação inversa.
configureFromPlace
configureFromPlace(place)
Parâmetros:
  • place:  Place|{id:string} o lugar para renderizar detalhes.
Valor de retorno:Promise<void> uma promessa que é resolvida quando os dados de lugar são carregados e renderizados.
Configura o widget com base em um objeto Place ou ID de lugar.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parâmetros:
  • type:  string uma string que especifica o tipo de evento para o qual um listener de eventos será removido.
  • listener:  EventListener|EventListenerObject o listener de eventos do manipulador de eventos a ser removido do destino do evento.
  • options:  boolean|EventListenerOptions optional consulte opções.
Valor de retorno:void
Remove do destino um listener de eventos registrado anteriormente com addEventListener. Consulte removeEventListener.
gmp-load
function(event)
Argumentos: 
Esse evento é acionado quando o elemento carrega e renderiza o conteúdo. Esse evento não é propagado.
gmp-requesterror
function(event)
Argumentos: 
Esse evento é disparado quando uma solicitação ao back-end é negada (por exemplo, chave de API incorreta). Esse evento não é propagado.

Interface PlaceDetailsElementOptions

Interface google.maps.places.PlaceDetailsElementOptions

Opções de PlaceDetailsElement.
size optional
Tipo:PlaceDetailsSize optional
Ver PlaceDetailsElement.size

Constantes PlaceDetailsSize

Constantes de google.maps.places.PlaceDetailsSize

Variantes de tamanho para PlaceDetailsElement.

Acesse ligando para const {PlaceDetailsSize} = await google.maps.importLibrary("places").
Consulte Bibliotecas na API Maps JavaScript.
LARGE Variante grande, incluindo uma imagem grande, informações básicas e dados de contato.
MEDIUM Variante média com uma imagem grande e informações básicas.
SMALL Variante pequena com uma imagem pequena e informações básicas.
X_LARGE Variante extragrande, incluindo uma colagem de fotos, avaliações e informações abrangentes sobre o lugar.

Classe PlaceListElement

Classe google.maps.places.PlaceListElement

Um elemento HTML que mostra os resultados de uma pesquisa de lugar em uma lista. Use os métodos configureFromSearchByTextRequest() ou configureFromSearchNearbyRequest() para especificar a solicitação de renderização dos resultados. Para usar o elemento de lista de lugares, ative a API Places UI Kit no projeto no console do Google Cloud.

Elemento personalizado:
<gmp-place-list selectable></gmp-place-list>

Essa classe estende HTMLElement.

Essa classe implementa PlaceListElementOptions.

Acesse ligando para const {PlaceListElement} = await google.maps.importLibrary("places").
Consulte Bibliotecas na API Maps JavaScript.
PlaceListElement
PlaceListElement([options])
Parâmetros:
places
Tipo:Array<Place>
Somente leitura. Matriz de objetos Place que contém os IDs, locais e viewports dos lugares renderizados no momento.
selectable
Tipo:boolean
Se os itens da lista podem ser selecionados. Se for verdadeiro, os itens da lista serão botões que vão disparar o evento gmp-placeselect quando forem clicados. A navegação e a seleção acessíveis pelo teclado também são compatíveis.
Atributo HTML:
  • <gmp-place-list selectable></gmp-place-list>
BetaaddEventListener
addEventListener(type, listener[, options])
Parâmetros:
  • type:  string uma string que diferencia maiúsculas de minúsculas e representa o tipo de evento a ser detectado.
  • listener:  EventListener|EventListenerObject o objeto que recebe uma notificação. Precisa ser uma função ou um objeto com o método handleEvent.
  • options:  boolean|AddEventListenerOptions optional consulte opções. Os eventos personalizados só são compatíveis com capture e passive.
Valor de retorno:void
Configura uma função que será chamada sempre que o evento especificado for entregue ao destino. Consulte addEventListener.
configureFromSearchByTextRequest
configureFromSearchByTextRequest(request)
Parâmetros:
  • request:  SearchByTextRequest a solicitação para renderizar resultados. A propriedade fields do SearchByTextRequest não é obrigatória.
Valor de retorno:Promise<void> uma promessa que é resolvida quando os dados de lugar são carregados e renderizados.
Configura o widget para renderizar resultados da pesquisa de um pedido da API Places Text Search.
configureFromSearchNearbyRequest
configureFromSearchNearbyRequest(request)
Parâmetros:
  • request:  SearchNearbyRequest a solicitação para renderizar resultados. A propriedade fields do SearchNearbyRequest não é obrigatória.
Valor de retorno:Promise<void> uma promessa que é resolvida quando os dados de lugar são carregados e renderizados.
Configura o widget para renderizar resultados da pesquisa de um pedido da API Places Nearby Search.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parâmetros:
  • type:  string uma string que especifica o tipo de evento para o qual um listener de eventos será removido.
  • listener:  EventListener|EventListenerObject o listener de eventos do manipulador de eventos a ser removido do destino do evento.
  • options:  boolean|EventListenerOptions optional consulte opções.
Valor de retorno:void
Remove do destino um listener de eventos registrado anteriormente com addEventListener. Consulte removeEventListener.
gmp-load
function(event)
Argumentos: 
Esse evento é acionado quando o elemento carrega e renderiza o conteúdo. Esse evento não é propagado.
gmp-placeselect
function(event)
Argumentos: 
Esse evento é acionado quando um usuário seleciona um lugar. Contém um objeto Place e o índice do lugar selecionado na lista.
gmp-requesterror
function(event)
Argumentos: 
Esse evento é disparado quando uma solicitação ao back-end é negada (por exemplo, chave de API incorreta). Esse evento não é propagado.

Interface PlaceListElementOptions

Interface google.maps.places.PlaceListElementOptions

Opções de PlaceListElement.
selectable optional
Tipo:boolean optional
Ver PlaceListElement.selectable

Classe PlaceListPlaceSelectEvent

Classe google.maps.places.PlaceListPlaceSelectEvent

Esse evento é emitido pelo PlaceListElement quando o usuário seleciona um lugar.

Essa classe estende Event.

Acesse ligando para const {PlaceListPlaceSelectEvent} = await google.maps.importLibrary("places").
Consulte Bibliotecas na API Maps JavaScript.
index
Tipo:number
O índice da lista do lugar selecionado.
place
Tipo:Place
Um objeto Place que contém o ID, a localização e a janela de visualização do lugar selecionado.

Classe Autocomplete

Classe google.maps.places.Autocomplete

Um widget que fornece previsões de lugares com base na entrada de texto de um usuário. Ele se conecta a um elemento de entrada do tipo text e aguarda a entrada de texto nesse campo. A lista de previsões é apresentada como um menu suspenso e é atualizada conforme o texto é inserido.

Essa classe estende MVCObject.

Acesse ligando para const {Autocomplete} = await google.maps.importLibrary("places").
Consulte Bibliotecas na API Maps JavaScript.
Autocomplete
Autocomplete(inputField[, opts])
Parâmetros:
Cria uma nova instância de Autocomplete que é anexada ao campo de texto de entrada especificado com as opções fornecidas.
getBounds
getBounds()
Parâmetros:nenhum
Valor de retorno:LatLngBounds|undefined os limites de polarização.
Retorna os limites para os quais as previsões são tendenciosas.
getFields
getFields()
Parâmetros:nenhum
Valor de retorno:Array<string>|undefined
Retorna os campos a serem incluídos para o lugar na resposta de detalhes quando eles são recuperados com sucesso. Para uma lista de campos, consulte PlaceResult.
getPlace
getPlace()
Parâmetros:nenhum
Valor de retorno:PlaceResult o lugar selecionado pelo usuário.
Retorna os detalhes do lugar selecionado pelo usuário se eles foram recuperados. Caso contrário, retorna um objeto Place stub, com a propriedade name definida como o valor atual do campo de entrada.
setBounds
setBounds(bounds)
Parâmetros:
Valor de retorno:nenhum
Define a área preferida em que os resultados de lugar serão retornados. Os resultados são direcionados, mas não restritos, a essa área.
setComponentRestrictions
setComponentRestrictions(restrictions)
Parâmetros:
Valor de retorno:nenhum
Define as restrições de componente. As restrições de componente são usadas para restringir as previsões apenas àquelas dentro do componente principal. Por exemplo, o país.
setFields
setFields(fields)
Parâmetros:
  • fields:  Array<string> optional
Valor de retorno:nenhum
Define os campos a serem incluídos para o lugar na resposta de detalhes quando eles são recuperados com sucesso. Para uma lista de campos, consulte PlaceResult.
setOptions
setOptions(options)
Parâmetros:
Valor de retorno:nenhum
setTypes
setTypes(types)
Parâmetros:
  • types:  Array<string> optional os tipos de previsões a serem incluídos.
Valor de retorno:nenhum
Define os tipos de previsões a serem retornadas. Para saber os tipos compatíveis, consulte o guia do desenvolvedor. Se nenhum tipo for especificado, todos serão retornados.
Herdado:addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
place_changed
function()
Argumentos:  nenhum
Esse evento é acionado quando um PlaceResult é disponibilizado para um lugar selecionado pelo usuário.
Se o usuário inserir o nome de um lugar que não foi sugerido pelo controle e pressionar a tecla "Enter", ou se uma solicitação de detalhes de lugar falhar, o PlaceResult vai conter a entrada do usuário na propriedade name, sem outras propriedades definidas.

Interface AutocompleteOptions

Interface google.maps.places.AutocompleteOptions

As opções que podem ser definidas em um objeto Autocomplete.
bounds optional
A área em que os lugares serão pesquisados.
componentRestrictions optional
Tipo:ComponentRestrictions optional
As restrições de componentes. As restrições de componente são usadas para restringir as previsões apenas àquelas dentro do componente principal. Por exemplo, o país.
fields optional
Tipo:Array<string> optional
Campos a serem incluídos para o lugar na resposta de detalhes quando eles são recuperados com sucesso, o que será cobrado. Se ['ALL'] for transmitido, todos os campos disponíveis serão retornados e faturados, o que não é recomendado para implantações de produção. Para uma lista de campos, consulte PlaceResult. Os campos aninhados podem ser especificados com caminhos de ponto (por exemplo, "geometry.location"). O padrão é ['ALL'].
placeIdOnly optional
Tipo:boolean optional
Se é necessário recuperar apenas IDs de lugar. O PlaceResult disponibilizado quando o evento "place_changed" é acionado só tem os campos "place_id", "types" e "name", com o "place_id", "types" e "description" retornados pelo serviço Autocomplete. Essa configuração está desativada por padrão.
strictBounds optional
Tipo:boolean optional
Um valor booleano que indica que o widget Autocomplete só deve retornar os lugares que estão dentro dos limites dele no momento em que a consulta é enviada. Definir strictBounds como false (que é o padrão) vai direcionar os resultados, mas não restringir, a lugares contidos nos limites.
types optional
Tipo:Array<string> optional
Os tipos de previsões a serem retornadas. Para saber os tipos compatíveis, consulte o guia do desenvolvedor. Se nenhum tipo for especificado, todos serão retornados.

Classe google.maps.places.SearchBox

Um widget que fornece previsões de consultas com base na entrada de texto de um usuário. Ele se conecta a um elemento de entrada do tipo text e aguarda a entrada de texto nesse campo. A lista de previsões é apresentada como um menu suspenso e é atualizada conforme o texto é inserido.

Essa classe estende MVCObject.

Acesse ligando para const {SearchBox} = await google.maps.importLibrary("places").
Consulte Bibliotecas na API Maps JavaScript.
SearchBox
SearchBox(inputField[, opts])
Parâmetros:
Cria uma nova instância de SearchBox que é anexada ao campo de texto de entrada especificado com as opções fornecidas.
getBounds
getBounds()
Parâmetros:nenhum
Valor de retorno:LatLngBounds|undefined
Retorna os limites para os quais as previsões de consulta são tendenciosas.
getPlaces
getPlaces()
Parâmetros:nenhum
Valor de retorno:Array<PlaceResult>|undefined
Retorna a consulta selecionada pelo usuário para ser usada com o evento places_changed.
setBounds
setBounds(bounds)
Parâmetros:
Valor de retorno:nenhum
Define a região a ser usada para influenciar as previsões de consultas. Os resultados serão direcionados, mas não restritos, a essa área.
Herdado:addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
places_changed
function()
Argumentos:  nenhum
Esse evento é acionado quando o usuário seleciona uma consulta. getPlaces deve ser usado para receber novos lugares.

Interface SearchBoxOptions

Interface google.maps.places.SearchBoxOptions

As opções que podem ser definidas em um objeto SearchBox.
bounds optional
A área para direcionar as previsões de consulta. As previsões são direcionadas, mas não restritas, a consultas que visam esses limites.