Places Widgets

Classe PlaceAutocompleteElement

Classe google.maps.places.PlaceAutocompleteElement

PlaceAutocompleteElement est une sous-classe HTMLElement qui fournit un composant d'interface utilisateur pour l'API Places Autocomplete.

PlaceAutocompleteElement utilise automatiquement des AutocompleteSessionToken en interne pour regrouper les phases de requête et de sélection d'une recherche de saisie semi-automatique d'un utilisateur.

Le premier appel à Place.fetchFields sur un Place renvoyé par PlacePrediction.toPlace inclura automatiquement le jeton de session utilisé pour récupérer le PlacePrediction.

Pour en savoir plus sur le fonctionnement des sessions, consultez https://developers.google.com/maps/documentation/places/web-service/place-session-tokens.

Élément personnalisé :
<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>

Cette classe étend HTMLElement.

Cette classe implémente PlaceAutocompleteElementOptions.

Accédez-y en appelant const {PlaceAutocompleteElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
PlaceAutocompleteElement
PlaceAutocompleteElement(options)
Paramètres : 
includedPrimaryTypes
Type : Array<string> optional
Type de lieu principal inclus (par exemple, "restaurant" ou "gas_station").

Un lieu n'est renvoyé que si son type principal est inclus dans cette liste. Vous pouvez spécifier jusqu'à cinq valeurs. Si aucun type n'est spécifié, tous les types de lieux sont renvoyés.
Attribut HTML :
  • <gmp-place-autocomplete included-primary-types="type1 type2 type3..."></gmp-place-autocomplete>
includedRegionCodes
Type : Array<string> optional
Incluez uniquement les résultats dans les régions spécifiées, sous la forme de 15 codes de région CLDR à deux caractères maximum. Un ensemble vide ne limitera pas les résultats. Si locationRestriction et includedRegionCodes sont tous deux définis, les résultats se trouveront dans la zone d'intersection.
Attribut HTML :
  • <gmp-place-autocomplete included-region-codes="c1 c2 c3..."></gmp-place-autocomplete>
locationBias
Type : LocationBias optional
Limite souple ou indice à utiliser lors de la recherche de lieux.
locationRestriction
Type : LocationRestriction optional
Limites pour restreindre les résultats de recherche.
name
Type : string optional
Nom à utiliser pour l'élément d'entrée. Pour en savoir plus, consultez https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name. Suit le même comportement que l'attribut "name" pour les entrées. Notez qu'il s'agit du nom qui sera utilisé lors de l'envoi d'un formulaire. Pour en savoir plus, consultez https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form.
Attribut HTML :
  • <gmp-place-autocomplete name="string"></gmp-place-autocomplete>
origin
Origine à partir de laquelle calculer la distance. Si aucune valeur n'est spécifiée, la distance n'est pas calculée. L'altitude, si elle est indiquée, n'est pas utilisée dans le calcul.
Attribut HTML :
  • <gmp-place-autocomplete origin="lat,lng"></gmp-place-autocomplete>
  • <gmp-place-autocomplete origin="lat,lng,altitude"></gmp-place-autocomplete>
placeholder
Type : string
Texte d'espace réservé à afficher dans l'élément d'entrée.
requestedLanguage
Type : string optional
Identifiant de la langue dans laquelle les résultats doivent être renvoyés, si possible. Les résultats dans la langue sélectionnée peuvent être mieux classés, mais les suggestions ne sont pas limitées à cette langue. Consultez la liste des langues disponibles.
Attribut HTML :
  • <gmp-place-autocomplete requested-language="string"></gmp-place-autocomplete>
requestedRegion
Type : string optional
Code de région utilisé pour la mise en forme et le filtrage des résultats. Elle ne limite pas les suggestions à ce pays. Le code régional accepte une valeur ccTLD ("domaine de premier niveau") à deux caractères. La plupart des codes ccTLD sont identiques aux codes ISO 3166-1, à quelques exceptions près. Par exemple, le ccTLD du Royaume-Uni est "uk" (.co.uk), tandis que son code ISO 3166-1 est "gb" (techniquement pour l'entité "Royaume-Uni de Grande-Bretagne et d'Irlande du Nord").
Attribut HTML :
  • <gmp-place-autocomplete requested-region="string"></gmp-place-autocomplete>
unitSystem
Type : UnitSystem optional
Système d'unités utilisé pour afficher les distances. Si ce paramètre n'est pas spécifié, le système d'unités est déterminé par requestedRegion.
Attribut HTML :
  • <gmp-place-autocomplete unit-system="metric"></gmp-place-autocomplete>
  • <gmp-place-autocomplete unit-system="imperial"></gmp-place-autocomplete>
value
Type : string
Valeur de l'élément d'entrée.
prediction-item-icon
Cet emplacement accepte exactement un élément <template> à afficher en tant qu'icône à côté de l'élément de prédiction.
input
Élément d'entrée pour l'élément de saisie semi-automatique.
prediction-item
Élément de la liste déroulante des prédictions qui représente une seule prédiction.
prediction-item-icon
Icône affichée à gauche de chaque élément dans la liste des prédictions.
prediction-item-main-text
Partie de l'élément de prédiction qui constitue le texte principal de la prédiction. Pour les emplacements géographiques, cet élément contient le nom du lieu, par exemple "Sydney", ou le nom et le numéro d'une rue, comme "10 King Street". Par défaut, prediction-item-main-text est coloré en noir. Si le champ prediction-item contient du texte supplémentaire, il se trouve en dehors de prediction-item-main-text et hérite son style de prediction-item. Par défaut, il apparaît en gris. Le texte additionnel est généralement une adresse.
prediction-item-match
Partie de la prédiction renvoyée qui correspond à ce qu'a saisi l'utilisateur. Par défaut, le texte correspondant apparaît en gras. Notez que le texte correspondant peut se trouver n'importe où dans prediction-item. Il ne fait pas nécessairement partie de prediction-item-main-text.
prediction-item-selected
Élément vers lequel l'utilisateur navigue avec le clavier. Remarque : Les éléments sélectionnés seront affectés par les styles de cette partie et par les styles de la partie prediction-item.
prediction-list
Élément visuel contenant la liste des prédictions renvoyées par le service Place Autocomplete. Cette liste apparaît sous forme de liste déroulante sous PlaceAutocompleteElement.
background-color
Remplace la couleur d'arrière-plan de l'élément.
border
Remplace la bordure de l'élément.
border-radius
Remplace le rayon de la bordure de l'élément.
color
Remplace la police de l'élément.
color-scheme
Indique le jeu de couleurs dans lequel cet élément peut être affiché. Pour en savoir plus, consultez la documentation sur color-scheme. La valeur par défaut est color-scheme: light dark.
font
Remplace la police de l'élément.
font-family
Remplace la police de l'élément.
font-size
Remplace la police de l'élément.
font-style
Remplace la police de l'élément.
font-weight
Remplace la police de l'élément.
line-height
Remplace la police de l'élément.
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.
gmp-error
function(errorEvent)
Arguments :
Cet événement est déclenché lorsqu'une requête adressée au backend est refusée (par exemple, clé API incorrecte). Cet événement ne se propage pas.
gmp-select
function(placePredictionSelectEvent)
Arguments :
Cet événement est déclenché lorsqu'un utilisateur sélectionne une prédiction de lieu. Contient un objet PlacePrediction qui peut être converti en objet Place.

Interface PlaceAutocompleteElementOptions

google.maps.places.PlaceAutocompleteElementOptions interface

Options de construction d'un PlaceAutocompleteElement. Pour obtenir la description de chaque propriété, reportez-vous à la propriété du même nom dans la classe PlaceAutocompleteElement.
includedPrimaryTypes optional
Type : Array<string> optional
includedRegionCodes optional
Type : Array<string> optional
locationBias optional
Type : LocationBias optional
locationRestriction optional
Type : LocationRestriction optional
name optional
Type : string optional
origin optional
requestedLanguage optional
Type : string optional
requestedRegion optional
Type : string optional
unitSystem optional
Type : UnitSystem optional
value optional
Type : string optional
Valeur de l'élément d'entrée.

Classe PlacePredictionSelectEvent

Classe google.maps.places.PlacePredictionSelectEvent

Cet événement est créé une fois que l'utilisateur a sélectionné un élément de prédiction avec PlaceAutocompleteElement. Accédez à la sélection avec event.placePrediction.

Convertissez placePrediction en Place en appelant PlacePrediction.toPlace.

Cette classe étend Event.

Accédez-y en appelant const {PlacePredictionSelectEvent} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
placePrediction
Convertissez-le en Place en appelant PlacePrediction.toPlace.

BasicPlaceAutocompleteElement

Classe google.maps.places.BasicPlaceAutocompleteElement

BasicPlaceAutocompleteElement est une sous-classe HTMLElement qui fournit un composant d'interface utilisateur pour l'API Places Autocomplete.

Élément personnalisé :
<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>

Cette classe étend HTMLElement.

Cette classe implémente BasicPlaceAutocompleteElementOptions.

Accédez-y en appelant const {BasicPlaceAutocompleteElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
BasicPlaceAutocompleteElement
BasicPlaceAutocompleteElement(options)
Paramètres : 
includedPrimaryTypes
Type : Array<string> optional
Type de lieu principal inclus (par exemple, "restaurant" ou "gas_station").

Un lieu n'est renvoyé que si son type principal est inclus dans cette liste. Vous pouvez spécifier jusqu'à cinq valeurs. Si aucun type n'est spécifié, tous les types de lieux sont renvoyés.
Attribut HTML :
  • <gmp-basic-place-autocomplete included-primary-types="type1 type2 type3..."></gmp-basic-place-autocomplete>
includedRegionCodes
Type : Array<string> optional
Incluez uniquement les résultats dans les régions spécifiées, sous la forme de 15 codes de région CLDR à deux caractères maximum. Un ensemble vide ne limitera pas les résultats. Si locationRestriction et includedRegionCodes sont tous deux définis, les résultats se trouveront dans la zone d'intersection.
Attribut HTML :
  • <gmp-basic-place-autocomplete included-region-codes="c1 c2 c3..."></gmp-basic-place-autocomplete>
locationBias
Type : LocationBias optional
Limite souple ou indice à utiliser lors de la recherche de lieux.
locationRestriction
Type : LocationRestriction optional
Limites pour restreindre les résultats de recherche.
name
Type : string optional
Nom à utiliser pour l'élément d'entrée. Pour en savoir plus, consultez https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name. Suit le même comportement que l'attribut "name" pour les entrées. Notez qu'il s'agit du nom qui sera utilisé lors de l'envoi d'un formulaire. Pour en savoir plus, consultez https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form.
Attribut HTML :
  • <gmp-basic-place-autocomplete name="string"></gmp-basic-place-autocomplete>
origin
Origine à partir de laquelle calculer la distance. Si aucune valeur n'est spécifiée, la distance n'est pas calculée. L'altitude, si elle est indiquée, n'est pas utilisée dans le calcul.
Attribut 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
Type : string optional
Identifiant de la langue dans laquelle les résultats doivent être renvoyés, si possible. Les résultats dans la langue sélectionnée peuvent être mieux classés, mais les suggestions ne sont pas limitées à cette langue. Consultez la liste des langues disponibles.
Attribut HTML :
  • <gmp-basic-place-autocomplete requested-language="string"></gmp-basic-place-autocomplete>
requestedRegion
Type : string optional
Code de région utilisé pour la mise en forme et le filtrage des résultats. Elle ne limite pas les suggestions à ce pays. Le code régional accepte une valeur ccTLD ("domaine de premier niveau") à deux caractères. La plupart des codes ccTLD sont identiques aux codes ISO 3166-1, à quelques exceptions près. Par exemple, le ccTLD du Royaume-Uni est "uk" (.co.uk), tandis que son code ISO 3166-1 est "gb" (techniquement pour l'entité "Royaume-Uni de Grande-Bretagne et d'Irlande du Nord").
Attribut HTML :
  • <gmp-basic-place-autocomplete requested-region="string"></gmp-basic-place-autocomplete>
unitSystem
Type : UnitSystem optional
Système d'unités utilisé pour afficher les distances. Si ce paramètre n'est pas spécifié, le système d'unités est déterminé par requestedRegion.
Attribut 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
Cet emplacement accepte exactement un élément <template> à afficher en tant qu'icône à côté de l'élément de prédiction.
input
Élément d'entrée pour l'élément de saisie semi-automatique.
prediction-item
Élément de la liste déroulante des prédictions qui représente une seule prédiction.
prediction-item-icon
Icône affichée à gauche de chaque élément dans la liste des prédictions.
prediction-item-main-text
Partie de l'élément de prédiction qui constitue le texte principal de la prédiction. Pour les emplacements géographiques, cet élément contient le nom du lieu, par exemple "Sydney", ou le nom et le numéro d'une rue, comme "10 King Street". Par défaut, prediction-item-main-text est coloré en noir. Si le champ prediction-item contient du texte supplémentaire, il se trouve en dehors de prediction-item-main-text et hérite son style de prediction-item. Par défaut, il apparaît en gris. Le texte additionnel est généralement une adresse.
prediction-item-match
Partie de la prédiction renvoyée qui correspond à ce qu'a saisi l'utilisateur. Par défaut, le texte correspondant apparaît en gras. Notez que le texte correspondant peut se trouver n'importe où dans prediction-item. Il ne fait pas nécessairement partie de prediction-item-main-text.
prediction-item-selected
Élément vers lequel l'utilisateur navigue avec le clavier. Remarque : Les éléments sélectionnés seront affectés par les styles de cette partie et par les styles de la partie prediction-item.
prediction-list
Élément visuel contenant la liste des prédictions renvoyées par le service Place Autocomplete. Cette liste apparaît sous forme de liste déroulante sous PlaceAutocompleteElement.
background-color
Remplace la couleur d'arrière-plan de l'élément.
border
Remplace la bordure de l'élément.
border-radius
Remplace le rayon de la bordure de l'élément.
color
Remplace la police de l'élément.
color-scheme
Indique le jeu de couleurs dans lequel cet élément peut être affiché. Pour en savoir plus, consultez la documentation sur color-scheme. La valeur par défaut est color-scheme: light dark.
font
Remplace la police de l'élément.
font-family
Remplace la police de l'élément.
font-size
Remplace la police de l'élément.
font-style
Remplace la police de l'élément.
font-weight
Remplace la police de l'élément.
line-height
Remplace la police de l'élément.
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent.
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.
gmp-error
function(errorEvent)
Arguments :
Cet événement est déclenché lorsqu'une requête adressée au backend est refusée (par exemple, clé API incorrecte). Cet événement ne se propage pas.
gmp-select
function(placeSelectEvent)
Arguments :
Cet événement est déclenché lorsqu'un utilisateur sélectionne une prédiction de lieu. Contient un objet Place.

BasicPlaceAutocompleteElementOptions

google.maps.places.BasicPlaceAutocompleteElementOptions interface

Options de construction d'un BasicPlaceAutocompleteElement.
includedPrimaryTypes optional
Type : Array<string> optional
includedRegionCodes optional
Type : Array<string> optional
locationBias optional
Type : LocationBias optional
locationRestriction optional
Type : LocationRestriction optional
name optional
Type : string optional
origin optional
requestedLanguage optional
Type : string optional
requestedRegion optional
Type : string optional
unitSystem optional
Type : UnitSystem optional

Classe PlaceDetailsElement

Classe google.maps.places.PlaceDetailsElement

Affiche les détails d'un lieu dans une mise en page complète. Ajoutez PlaceDetailsPlaceRequestElement ou PlaceDetailsLocationRequestElement pour spécifier le lieu à afficher. Ajoutez PlaceContentConfigElement, PlaceStandardContentElement ou PlaceAllContentElement pour spécifier le contenu à afficher.

Exemple : 

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

Pour utiliser cet élément, activez l'API Kit UI pour Places pour votre projet dans la console Google Cloud.

Élément personnalisé :
<gmp-place-details></gmp-place-details>

Cette classe étend HTMLElement.

Cette classe implémente PlaceDetailsElementOptions.

Accédez-y en appelant const {PlaceDetailsElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
PlaceDetailsElement
PlaceDetailsElement([options])
Paramètres : 
place
Type : Place optional
Lecture seule. Objet Place contenant l'ID, l'emplacement et la fenêtre d'affichage du lieu actuellement affiché.
--gmp-button-border-color
Couleur de la bordure du bouton "Ouvrir dans Maps".
--gmp-button-border-radius
Rayon de la bordure du bouton "Ouvrir dans Maps".
--gmp-button-border-width
Largeur de la bordure du bouton "Ouvrir dans Maps".
--gmp-collage-border-radius-outer
Rayon de bordure des angles extérieurs du collage multimédia.
--gmp-dialog-border-radius
Rayon de la bordure de la boîte de dialogue de divulgation Google Maps.
--gmp-mat-color-disabled-surface
Couleur de surface destinée à indiquer les états désactivés ou l'absence. Utilisé pour les étoiles d'avis vides.
--gmp-mat-color-info
Couleur des éléments d'interface utilisateur avec un sentiment d'information. Utilisé pour l'icône de fauteuil roulant.
--gmp-mat-color-negative
Couleur des éléments d'interface utilisateur avec un sentiment négatif. Utilisé pour le texte "Fermé" dans l'état "Ouvert actuellement".
--gmp-mat-color-neutral-container
Couleur du conteneur pour les éléments d'interface utilisateur remplis de manière neutre. Utilisé pour les espaces réservés aux images et le badge de date de publication de l'avis.
--gmp-mat-color-on-neutral-container
Couleur du texte et des icônes par rapport à la couleur neutre du conteneur. Utilisé pour le badge de date de publication de l'avis et le badge de disponibilité de la borne pour véhicules électriques lorsqu'elle n'est pas disponible.
--gmp-mat-color-on-positive-container
Couleur des textes et des icônes par rapport à la couleur du conteneur positif. Utilisé pour le badge de disponibilité de la borne pour véhicules électriques, lorsqu'il est disponible.
--gmp-mat-color-on-secondary-container
Couleur du texte et des icônes par rapport à la couleur du conteneur secondaire. Utilisé pour le texte et les icônes du bouton "Ouvrir dans Maps".
--gmp-mat-color-on-surface
Couleur du texte et des icônes sur n'importe quelle couleur de surface. Utilisé pour le texte standard.
--gmp-mat-color-on-surface-variant
Couleur moins accentuée pour le texte et les icônes sur n'importe quelle couleur de surface. Utilisé pour le texte moins mis en avant.
--gmp-mat-color-outline-decorative
Couleur du contour des éléments non interactifs. Utilisée pour la bordure de l'élément.
--gmp-mat-color-positive
Couleur des éléments d'interface utilisateur avec un sentiment positif. Utilisé pour le texte "Ouvert" dans l'état "Ouvert actuellement".
--gmp-mat-color-positive-container
Couleur du conteneur pour les éléments d'interface utilisateur qui transmettent un sentiment positif. Utilisé pour le badge de disponibilité de la borne pour véhicules électriques, lorsqu'il est disponible.
--gmp-mat-color-primary
Couleur du texte et des icônes interactifs par rapport à la couleur de la surface. Utilisé pour le nombre d'avis, les liens dans la boîte de dialogue des informations Google Maps, le lien vers le site Web, les icônes de l'onglet "Aperçu" et (survol/sélection/couleur du texte) sur les titres de la barre d'onglets.
--gmp-mat-color-secondary-container
Couleur de remplissage moins visible sur la surface, pour les composants récessifs tels que les boutons tonaux. Utilisée pour l'arrière-plan du bouton "Ouvrir dans Maps".
--gmp-mat-color-surface
Couleur des arrière-plans. Utilisé pour les arrière-plans de l'élément et de la boîte de dialogue des informations Google Maps.
--gmp-mat-font-body-medium
Utilisé pour l'adresse, la note, le type, le prix, l'état d'ouverture, les horaires d'ouverture, l'avis, le numéro de téléphone, le site Web, le Plus Code, les principales caractéristiques et le corps du texte du lieu dans la boîte de dialogue des informations Google Maps.
--gmp-mat-font-body-small
Utilisé pour le corps du texte dans la liste des fonctionnalités de l'onglet "À propos".
--gmp-mat-font-display-small
Utilisé pour le nom du lieu et le texte de chaque titre de caractéristique dans l'onglet "À propos".
--gmp-mat-font-family
Famille de polices de base utilisée pour tout le texte.
--gmp-mat-font-headline-medium
Utilisé pour le texte d'en-tête dans la boîte de dialogue des informations Google Maps.
--gmp-mat-font-label-large
Utilisé pour les titres des onglets, le bouton "Ouvrir dans Maps", le texte d'attribution de l'auteur de l'avis dans la galerie photo, le texte d'attribution de l'auteur de l'avis dans la section des avis et les liens dans la boîte de dialogue des informations Google Maps.
--gmp-mat-font-label-medium
Utilisé pour le badge du nombre de photos et le badge de la date de publication de l'avis.
--gmp-mat-font-title-small
Utilisé pour le titre de chaque section de l'onglet "À propos".
--gmp-mat-spacing-extra-large
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-extra-small
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-large
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-medium
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-small
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-two-extra-large
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-star-rating-color
Couleur des étoiles pleines dans la note.
background-color
Remplace la couleur d'arrière-plan de l'élément.
border
Remplace la bordure de l'élément.
border-radius
Remplace le rayon de la bordure de l'élément.
color-scheme
Indique le jeu de couleurs dans lequel cet élément peut être affiché. Pour en savoir plus, consultez la documentation sur color-scheme. La valeur par défaut est color-scheme: light dark.
font-size
Met à l'échelle l'ensemble du texte et des icônes de l'élément, qui sont définis en interne en ems. La valeur par défaut est 16px.
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.
gmp-error
function(event)
Arguments :
Cet événement est déclenché lorsqu'une requête adressée au backend est refusée (par exemple, clé API incorrecte). Cet événement ne se propage pas.
gmp-load
function(event)
Arguments :
Cet événement est déclenché lorsque l'élément charge et affiche son contenu. Cet événement ne se propage pas.

PlaceDetailsElementOptions

google.maps.places.PlaceDetailsElementOptions interface

Options pour PlaceDetailsElement.

Classe PlaceDetailsCompactElement

Classe google.maps.places.PlaceDetailsCompactElement

Affiche les détails d'un lieu dans une mise en page compacte. Ajoutez PlaceDetailsPlaceRequestElement ou PlaceDetailsLocationRequestElement pour spécifier l'emplacement à afficher. Ajoutez PlaceContentConfigElement, PlaceStandardContentElement ou PlaceAllContentElement pour spécifier le contenu à afficher.

Exemple : 

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

Pour utiliser cet élément, activez l'API Kit UI pour Places pour votre projet dans la console Google Cloud.

Élément personnalisé :
<gmp-place-details-compact orientation="vertical" truncation-preferred></gmp-place-details-compact>

Cette classe étend HTMLElement.

Cette classe implémente PlaceDetailsCompactElementOptions.

Accédez-y en appelant const {PlaceDetailsCompactElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
PlaceDetailsCompactElement
PlaceDetailsCompactElement([options])
Paramètres : 
orientation
Type : PlaceDetailsOrientation optional
Par défaut : PlaceDetailsOrientation.VERTICAL
Variante d'orientation (verticale ou horizontale) de l'élément.
Attribut HTML :
  • <gmp-place-details-compact orientation="vertical"></gmp-place-details-compact>
  • <gmp-place-details-compact orientation="horizontal"></gmp-place-details-compact>
place
Type : Place optional
Lecture seule. Objet Place contenant l'ID, l'emplacement et la fenêtre d'affichage du lieu actuellement affiché.
truncationPreferred
Type : boolean
Par défaut : false
Si la valeur est "true", le nom et l'adresse du lieu sont tronqués pour tenir sur une seule ligne au lieu d'être renvoyés à la ligne.
Attribut HTML :
  • <gmp-place-details-compact truncation-preferred></gmp-place-details-compact>
--gmp-button-border-color
Couleur de la bordure du bouton "Ouvrir dans Maps".
--gmp-button-border-radius
Rayon de la bordure du bouton "Ouvrir dans Maps".
--gmp-button-border-width
Largeur de la bordure du bouton "Ouvrir dans Maps".
--gmp-dialog-border-radius
Rayon de la bordure de la boîte de dialogue de divulgation Google Maps.
--gmp-mat-color-info
Couleur des éléments d'interface utilisateur avec un sentiment d'information. Utilisé pour l'icône de fauteuil roulant.
--gmp-mat-color-negative
Couleur des éléments d'interface utilisateur avec un sentiment négatif. Utilisé pour le texte "Fermé" dans l'état "Ouvert actuellement".
--gmp-mat-color-neutral-container
Couleur du conteneur pour les éléments d'interface utilisateur remplis de manière neutre. Utilisé pour les espaces réservés d'image.
--gmp-mat-color-on-secondary-container
Couleur du texte et des icônes par rapport à la couleur du conteneur secondaire. Utilisé pour le texte et les icônes du bouton "Ouvrir dans Maps".
--gmp-mat-color-on-surface
Couleur du texte et des icônes sur n'importe quelle couleur de surface. Utilisé pour le texte standard.
--gmp-mat-color-on-surface-variant
Couleur moins accentuée pour le texte et les icônes sur n'importe quelle couleur de surface. Utilisé pour le texte moins mis en avant.
--gmp-mat-color-outline-decorative
Couleur du contour des éléments non interactifs. Utilisée pour la bordure de l'élément.
--gmp-mat-color-positive
Couleur des éléments d'interface utilisateur avec un sentiment positif. Utilisé pour le texte "Ouvert" dans l'état "Ouvert actuellement".
--gmp-mat-color-primary
Couleur du texte et des icônes interactifs par rapport à la couleur de la surface. Utilisé pour le nombre d'avis, ainsi que pour les liens dans la boîte de dialogue des informations Google Maps.
--gmp-mat-color-secondary-container
Couleur de remplissage moins visible sur la surface, pour les composants récessifs tels que les boutons tonaux. Utilisée pour l'arrière-plan du bouton "Ouvrir dans Maps".
--gmp-mat-color-surface
Couleur des arrière-plans. Utilisé pour les arrière-plans de l'élément et de la boîte de dialogue des informations Google Maps.
--gmp-mat-font-body-medium
Utilisé pour le corps du texte dans la boîte de dialogue des informations Google Maps.
--gmp-mat-font-body-small
Utilisé pour l'adresse, la note, le type, le prix et l'état d'ouverture du lieu.
--gmp-mat-font-family
Famille de polices de base utilisée pour tout le texte.
--gmp-mat-font-headline-medium
Utilisé pour le texte d'en-tête dans la boîte de dialogue des informations Google Maps.
--gmp-mat-font-label-large
Utilisé pour le bouton "Ouvrir dans Maps", ainsi que pour les liens de la boîte de dialogue des informations légales de Google Maps et le texte d'attribution de l'auteur de l'avis dans la galerie photo.
--gmp-mat-font-label-medium
Utilisé pour le badge du nombre de photos.
--gmp-mat-font-title-small
Utilisé pour le nom du lieu.
--gmp-mat-spacing-extra-small
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-large
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-medium
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-small
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-star-rating-color
Couleur des étoiles pleines dans la note.
--gmp-thumbnail-border-radius
Rayon de la bordure de l'image miniature du lieu.
background-color
Remplace la couleur d'arrière-plan de l'élément.
border
Remplace la bordure de l'élément.
border-radius
Remplace le rayon de la bordure de l'élément.
color-scheme
Indique le jeu de couleurs dans lequel cet élément peut être affiché. Pour en savoir plus, consultez la documentation sur color-scheme. La valeur par défaut est color-scheme: light dark.
font-size
Met à l'échelle l'ensemble du texte et des icônes de l'élément, qui sont définis en interne en ems. La valeur par défaut est 16px.
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.
gmp-error
function(event)
Arguments :
Cet événement est déclenché lorsqu'une requête adressée au backend est refusée (par exemple, clé API incorrecte). Cet événement ne se propage pas.
gmp-load
function(event)
Arguments :
Cet événement est déclenché lorsque l'élément charge et affiche son contenu. Cet événement ne se propage pas.

PlaceDetailsCompactElementOptions interface

google.maps.places.PlaceDetailsCompactElementOptions interface

Options pour PlaceDetailsCompactElement.
orientation optional
Type : PlaceDetailsOrientation optional
Consultez les PlaceDetailsCompactElement.orientation.
truncationPreferred optional
Type : boolean optional
Consultez les PlaceDetailsCompactElement.truncationPreferred.

PlaceDetailsOrientation constants

google.maps.places.PlaceDetailsOrientation constantes

Variantes d'orientation pour PlaceDetailsCompactElement.

Accédez-y en appelant const {PlaceDetailsOrientation} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
HORIZONTAL Orientation horizontale.
VERTICAL Orientation verticale.

PlaceDetailsPlaceRequestElement

Classe google.maps.places.PlaceDetailsPlaceRequestElement

Configure un PlaceDetailsCompactElement ou un PlaceDetailsElement pour charger des données en fonction d'un objet, d'un ID ou d'un nom de ressource de lieu. Ajoutez cet élément en tant qu'enfant d'un élément PlaceDetailsCompactElement ou PlaceDetailsElement pour charger les données du lieu spécifié. Exemple : 

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

Élément personnalisé :
<gmp-place-details-place-request place="some-place-id"></gmp-place-details-place-request>

Cette classe étend HTMLElement.

Cette classe implémente PlaceDetailsPlaceRequestElementOptions.

Accédez-y en appelant const {PlaceDetailsPlaceRequestElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
PlaceDetailsPlaceRequestElement
PlaceDetailsPlaceRequestElement([options])
Paramètres : 
place
Type : Place optional
Par défaut : null
Objet, ID ou nom de ressource du lieu dont vous souhaitez afficher les détails dans l'élément Place Details Compact. Cette propriété reflète l'attribut en tant que nom de ressource.
Attribut HTML :
  • <gmp-place-details-place-request place="some-place-id"></gmp-place-details-place-request>
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.

Interface PlaceDetailsPlaceRequestElementOptions

google.maps.places.PlaceDetailsPlaceRequestElementOptions interface

Options pour PlaceDetailsPlaceRequestElement.
place optional
Type : Place|string optional
Voir les PlaceDetailsPlaceRequestElement.place

Classe PlaceDetailsLocationRequestElement

Classe google.maps.places.PlaceDetailsLocationRequestElement

Configure un PlaceDetailsCompactElement ou un PlaceDetailsElement pour charger des données en fonction d'un emplacement. Ajoutez cet élément en tant qu'enfant d'un élément PlaceDetailsCompactElement ou PlaceDetailsElement pour charger les données de l'emplacement spécifié. Exemple : 

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

Élément personnalisé :
<gmp-place-details-location-request location="lat,lng"></gmp-place-details-location-request>

Cette classe étend HTMLElement.

Cette classe implémente PlaceDetailsLocationRequestElementOptions.

Accédez-y en appelant const {PlaceDetailsLocationRequestElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
PlaceDetailsLocationRequestElement
PlaceDetailsLocationRequestElement([options])
Paramètres : 
location
Par défaut : null
Lieu pour lequel afficher les détails dans l'élément Place Details. Normalise en LatLngAltitude.
Attribut HTML :
  • <gmp-place-details-location-request location="lat,lng"></gmp-place-details-location-request>
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent.
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.

Interface PlaceDetailsLocationRequestElementOptions

google.maps.places.PlaceDetailsLocationRequestElementOptions interface

Options pour PlaceDetailsLocationRequestElement.
location optional
Emplacement pour lequel afficher le lieu.

Classe PlaceSearchElement

Classe google.maps.places.PlaceSearchElement

Affiche les résultats d'une recherche de lieu dans une liste. Ajoutez PlaceTextSearchRequestElement ou PlaceNearbySearchRequestElement pour spécifier la requête pour laquelle afficher les résultats. Ajoutez PlaceContentConfigElement, PlaceStandardContentElement ou PlaceAllContentElement pour spécifier le contenu à afficher.

Exemple : 

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

Pour utiliser l'élément Place Search, activez l'API Kit UI pour Places pour votre projet dans la console Google Cloud.

Élément personnalisé :
<gmp-place-search attribution-position="top" orientation="vertical" selectable truncation-preferred></gmp-place-search>

Cette classe étend HTMLElement.

Cette classe implémente PlaceSearchElementOptions.

Accédez-y en appelant const {PlaceSearchElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
PlaceSearchElement
PlaceSearchElement([options])
Paramètres : 
attributionPosition
Par défaut : PlaceSearchAttributionPosition.TOP
Position du logo d'attribution et du bouton de divulgation réglementaire.
Attribut HTML :
  • <gmp-place-search attribution-position="top"></gmp-place-search>
  • <gmp-place-search attribution-position="bottom"></gmp-place-search>
orientation
Type : PlaceSearchOrientation optional
Par défaut : PlaceSearchOrientation.VERTICAL
Variante d'orientation (verticale ou horizontale) de l'élément.
Attribut HTML :
  • <gmp-place-search orientation="vertical"></gmp-place-search>
  • <gmp-place-search orientation="horizontal"></gmp-place-search>
places
Type : Array<Place>
Lecture seule. Tableau d'objets Place contenant les ID, les emplacements et les fenêtres d'affichage des lieux actuellement affichés.
selectable
Type : boolean optional
Par défaut : false
Indique si les éléments de la liste sont sélectionnables ou non. Si la valeur est "true", les éléments de la liste seront des boutons qui déclencheront l'événement gmp-select lorsqu'un utilisateur cliquera dessus. La navigation et la sélection accessibles au clavier sont également prises en charge.
Attribut HTML :
  • <gmp-place-search selectable></gmp-place-search>
truncationPreferred
Type : boolean optional
Par défaut : false
Si la valeur est "true", tronque certaines lignes de contenu pour qu'elles tiennent sur une seule ligne au lieu de passer à la ligne.
Attribut HTML :
  • <gmp-place-search truncation-preferred></gmp-place-search>
--gmp-button-border-color
Couleur de la bordure du bouton "Ouvrir dans Maps".
--gmp-button-border-radius
Rayon de la bordure du bouton "Ouvrir dans Maps".
--gmp-button-border-width
Largeur de la bordure du bouton "Ouvrir dans Maps".
--gmp-card-border-radius
Rayon de la bordure des fiches de lieu.
--gmp-dialog-border-radius
Rayon de la bordure de la boîte de dialogue de divulgation de Google Maps.
--gmp-mat-color-info
Couleur des éléments d'interface utilisateur avec un sentiment d'information. Utilisé pour l'icône d'entrée accessible.
--gmp-mat-color-negative
Couleur des éléments d'interface utilisateur avec un sentiment négatif. Utilisé pour le libellé "Fermé" des horaires d'ouverture d'un lieu.
--gmp-mat-color-neutral-container
Couleur du conteneur pour les éléments d'interface utilisateur remplis de manière neutre. Utilisé pour les badges de date d'avis et les formes d'espace réservé de chargement.
--gmp-mat-color-on-neutral-container
Couleur du texte et des icônes sur un conteneur neutre. Utilisé pour le texte de la date de l'avis et le texte de l'erreur de chargement.
--gmp-mat-color-on-secondary-container
Couleur du texte et des icônes sur une couleur de conteneur secondaire. Utilisée pour le texte des boutons et les icônes.
--gmp-mat-color-on-surface
Couleur du texte et des icônes sur une couleur de surface. Utilisé pour les titres et le contenu des boîtes de dialogue.
--gmp-mat-color-on-surface-variant
Couleur moins accentuée pour le texte et les icônes sur une couleur de surface. Utilisé pour obtenir des informations sur un lieu.
--gmp-mat-color-outline-decorative
Couleur du contour des éléments non interactifs. Utilisé pour la bordure du conteneur.
--gmp-mat-color-positive
Couleur des éléments d'interface utilisateur avec un sentiment positif. Utilisé pour le libellé "Ouvert" des horaires d'ouverture d'un lieu.
--gmp-mat-color-primary
Couleur du texte et des icônes interactifs par rapport à la couleur de la surface. Utilisé pour les liens, l'indicateur de chargement et les icônes de présentation.
--gmp-mat-color-secondary-container
Couleur de remplissage moins visible sur une surface. Utilisé pour les arrière-plans des boutons.
--gmp-mat-color-surface
Couleur des arrière-plans. Utilisé pour les arrière-plans des conteneurs et des boîtes de dialogue.
--gmp-mat-font-body-small
Utilisé pour obtenir des informations sur un lieu.
--gmp-mat-font-family
Famille de polices de base pour tout le texte.
--gmp-mat-font-headline-medium
Utilisé pour les titres des boîtes de dialogue.
--gmp-mat-font-label-large
Utilisé pour le contenu du bouton.
--gmp-mat-font-title-medium
Utilisé pour le nom du lieu.
--gmp-mat-spacing-extra-small
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-large
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-medium
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-mat-spacing-small
Utilisé pour l'espacement dans l'élément, comme la marge et la marge intérieure autour du texte.
--gmp-star-rating-color
Couleur des étoiles pleines dans une note.
--gmp-thumbnail-border-radius
Rayon de la bordure de la miniature du lieu.
background-color
Remplace la couleur d'arrière-plan de l'élément.
border
Remplace la bordure de l'élément.
border-radius
Remplace le rayon de la bordure de l'élément.
color-scheme
Indique le jeu de couleurs dans lequel cet élément peut être affiché. Pour en savoir plus, consultez la documentation sur color-scheme. La valeur par défaut est color-scheme: light dark.
font-size
Met à l'échelle l'ensemble du texte et des icônes de l'élément. La valeur par défaut est 16px.
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.
gmp-error
function(event)
Arguments :
Cet événement est déclenché lorsqu'une requête adressée au backend est refusée (par exemple, clé API incorrecte). Cet événement ne se propage pas.
gmp-load
function(event)
Arguments :
Cet événement est déclenché lorsque l'élément charge et affiche son contenu. Cet événement ne se propage pas.
gmp-select
function(event)
Arguments :
Cet événement est déclenché lorsqu'un lieu est sélectionné dans la liste. Contient un objet Place contenant l'ID, l'emplacement et la fenêtre d'affichage du lieu sélectionné.

Interface PlaceSearchElementOptions

google.maps.places.PlaceSearchElementOptions interface

Options pour PlaceSearchElement.
attributionPosition optional
Consultez les PlaceSearchElement.attributionPosition.
orientation optional
Type : PlaceSearchOrientation optional
Consultez les PlaceSearchElement.orientation.
selectable optional
Type : boolean optional
Voir les PlaceSearchElement.selectable
truncationPreferred optional
Type : boolean optional
Consultez les PlaceSearchElement.truncationPreferred.

Constantes PlaceSearchAttributionPosition

google.maps.places.PlaceSearchAttributionPosition constantes

Positions d'attribution pour PlaceSearchElement.

Accédez-y en appelant const {PlaceSearchAttributionPosition} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
BOTTOM Attribution en bas de PlaceSearchElement
TOP Attribution en haut de PlaceSearchElement

PlaceSearchOrientation constants

google.maps.places.PlaceSearchOrientation constantes

Variantes d'orientation pour PlaceSearchElement.

Accédez-y en appelant const {PlaceSearchOrientation} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
HORIZONTAL Orientation horizontale.
VERTICAL Orientation verticale.

Classe PlaceSelectEvent

Classe google.maps.places.PlaceSelectEvent

Cet événement se déclenche lorsqu'un lieu est sélectionné dans une liste de lieux. Accédez à la sélection avec event.place.

Cette classe étend Event.

Accédez-y en appelant const {PlaceSelectEvent} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
place
Type : Place
Le lieu sélectionné.

Classe PlaceNearbySearchRequestElement

Classe google.maps.places.PlaceNearbySearchRequestElement

Configure un PlaceSearchElement pour charger les résultats en fonction d'une requête Nearby Search. La propriété locationRestriction est obligatoire pour charger l'élément de recherche. Toutes les autres propriétés configurées seront ignorées si locationRestriction n'est pas défini. Ajoutez cet élément en tant qu'enfant d'un PlaceSearchElement pour charger les résultats. Exemple : 

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

Élément personnalisé :
<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>

Cette classe étend HTMLElement.

Cette classe implémente PlaceNearbySearchRequestElementOptions.

Accédez-y en appelant const {PlaceNearbySearchRequestElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
PlaceNearbySearchRequestElement
PlaceNearbySearchRequestElement([options])
Paramètres : 
excludedPrimaryTypes
Type : Array<string> optional
Par défaut : null
Types de lieux principaux exclus.
Attribut HTML :
  • <gmp-place-nearby-search-request excluded-primary-types="excluded-primary-type1 excluded-primary-type2..."></gmp-place-nearby-search-request>
excludedTypes
Type : Array<string> optional
Par défaut : null
Types de lieux exclus.
Attribut HTML :
  • <gmp-place-nearby-search-request excluded-types="excluded-type1 excluded-type2..."></gmp-place-nearby-search-request>
includedPrimaryTypes
Type : Array<string> optional
Par défaut : null
Type de lieu principal inclus.
Attribut HTML :
  • <gmp-place-nearby-search-request included-primary-types="included-primary-type1 included-primary-type2..."></gmp-place-nearby-search-request>
includedTypes
Type : Array<string> optional
Par défaut : null
Type de lieu inclus.
Attribut HTML :
  • <gmp-place-nearby-search-request included-types="included-type1 included-type2..."></gmp-place-nearby-search-request>
locationRestriction
Type : Circle|CircleLiteral optional
Par défaut : null
Région dans laquelle effectuer la recherche. Normalise en Circle.
Attribut HTML :
  • <gmp-place-nearby-search-request location-restriction="radius@lat,lng"></gmp-place-nearby-search-request>
maxResultCount
Type : number optional
Par défaut : null
Nombre maximal de résultats à renvoyer.
Attribut HTML :
  • <gmp-place-nearby-search-request max-result-count="number"></gmp-place-nearby-search-request>
rankPreference
Par défaut : null
Comment les résultats seront classés dans la réponse.
Attribut HTML :
  • <gmp-place-nearby-search-request rank-preference="preference"></gmp-place-nearby-search-request>
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.

PlaceNearbySearchRequestElementOptions

google.maps.places.PlaceNearbySearchRequestElementOptions interface

Options pour PlaceNearbySearchRequestElement.
excludedPrimaryTypes optional
Type : Array<string> optional
Types de lieux principaux exclus. Pour en savoir plus, consultez PlaceNearbySearchRequestElement.excludedPrimaryTypes et SearchNearbyRequest.excludedPrimaryTypes.
excludedTypes optional
Type : Array<string> optional
Types de lieux exclus. Pour en savoir plus, consultez PlaceNearbySearchRequestElement.excludedTypes et SearchNearbyRequest.excludedTypes.
includedPrimaryTypes optional
Type : Array<string> optional
Types de lieux principaux inclus. Pour en savoir plus, consultez PlaceNearbySearchRequestElement.includedPrimaryTypes et SearchNearbyRequest.includedPrimaryTypes.
includedTypes optional
Type : Array<string> optional
Types de lieux inclus. Pour en savoir plus, consultez PlaceNearbySearchRequestElement.includedTypes et SearchNearbyRequest.includedTypes.
locationRestriction optional
Type : Circle|CircleLiteral optional
Région dans laquelle effectuer la recherche. Pour en savoir plus, consultez PlaceNearbySearchRequestElement.locationRestriction et SearchNearbyRequest.locationRestriction.
maxResultCount optional
Type : number optional
Nombre maximal de résultats à renvoyer. Pour en savoir plus, consultez PlaceNearbySearchRequestElement.maxResultCount et SearchNearbyRequest.maxResultCount.
rankPreference optional
Comment les résultats seront classés dans la réponse. Pour en savoir plus, consultez PlaceNearbySearchRequestElement.rankPreference et SearchNearbyRankPreference.

Classe PlaceTextSearchRequestElement

Classe google.maps.places.PlaceTextSearchRequestElement

Configure un PlaceSearchElement pour charger les résultats en fonction d'une requête de recherche textuelle. La propriété textQuery est obligatoire pour charger l'élément de recherche. Toutes les autres propriétés configurées seront ignorées si textQuery n'est pas défini. Ajoutez cet élément en tant qu'enfant d'un PlaceSearchElement pour charger les résultats. Exemple : 

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

Élément personnalisé :
<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>

Cette classe étend HTMLElement.

Cette classe implémente PlaceTextSearchRequestElementOptions.

Accédez-y en appelant const {PlaceTextSearchRequestElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
PlaceTextSearchRequestElement
PlaceTextSearchRequestElement([options])
Paramètres : 
evConnectorTypes
Type : Array<EVConnectorType> optional
Par défaut : null
Liste des types de connecteurs de VE préférés.
Attribut HTML :
  • <gmp-place-text-search-request ev-connector-types="ev-connector-type1 ev-connector-type2..."></gmp-place-text-search-request>
evMinimumChargingRateKw
Type : number optional
Par défaut : null
Vitesse de recharge minimale requise en kilowatts.
Attribut HTML :
  • <gmp-place-text-search-request ev-minimum-charging-rate-kw="rate"></gmp-place-text-search-request>
includedType
Type : string optional
Par défaut : null
Type de lieu demandé.
Attribut HTML :
  • <gmp-place-text-search-request included-type="type"></gmp-place-text-search-request>
isOpenNow
Type : boolean optional
Par défaut : null
Permet de limiter la recherche aux lieux qui sont actuellement ouverts.
Attribut HTML :
  • <gmp-place-text-search-request is-open-now="true"></gmp-place-text-search-request>
locationBias
Type : LocationBias optional
Par défaut : null
Biais de localisation pour la recherche. Normalise en LatLngAltitude | LatLngBounds | Circle | string.
Attribut 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
Par défaut : null
Restriction de l'emplacement pour la recherche. Normalise en LatLngBounds.
Attribut HTML :
  • <gmp-place-text-search-request location-restriction="swlat,swlng|nelat,nelng"></gmp-place-text-search-request>
maxResultCount
Type : number optional
Par défaut : null
Nombre maximal de résultats à renvoyer.
Attribut HTML :
  • <gmp-place-text-search-request max-result-count="number"></gmp-place-text-search-request>
minRating
Type : number optional
Par défaut : null
Excluez les résultats dont la note moyenne des utilisateurs est strictement inférieure à cette limite.
Attribut HTML :
  • <gmp-place-text-search-request min-rating="number"></gmp-place-text-search-request>
priceLevels
Type : Array<PriceLevel> optional
Par défaut : null
Permet de limiter la recherche aux lieux marqués comme correspondant à certains niveaux de prix.
Attribut HTML :
  • <gmp-place-text-search-request price-levels="price-level1 price-level2..."></gmp-place-text-search-request>
rankPreference
Par défaut : null
Comment les résultats seront classés dans la réponse.
Attribut HTML :
  • <gmp-place-text-search-request rank-preference="preference"></gmp-place-text-search-request>
textQuery
Type : string optional
Par défaut : null
Requête textuelle pour la recherche textuelle.
Attribut HTML :
  • <gmp-place-text-search-request text-query="string"></gmp-place-text-search-request>
useStrictTypeFiltering
Type : boolean optional
Par défaut : null
Permet de définir un filtrage de type strict pour "includedType".
Attribut HTML :
  • <gmp-place-text-search-request use-strict-type-filtering></gmp-place-text-search-request>
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.

PlaceTextSearchRequestElementOptions interface

google.maps.places.PlaceTextSearchRequestElementOptions interface

Options pour PlaceTextSearchRequestElement.
evConnectorTypes optional
Type : Array<EVConnectorType> optional
Liste des types de connecteurs de VE préférés. Pour en savoir plus, consultez SearchByTextRequest.evSearchOptions et PlaceTextSearchRequestElement.evConnectorTypes.
evMinimumChargingRateKw optional
Type : number optional
Vitesse de recharge minimale requise en kilowatts. Pour en savoir plus, consultez SearchByTextRequest.evSearchOptions et PlaceTextSearchRequestElement.evMinimumChargingRateKw.
includedType optional
Type : string optional
Type de lieu demandé. Pour en savoir plus, consultez SearchByTextRequest.includedType et PlaceTextSearchRequestElement.includedType.
isOpenNow optional
Type : boolean optional
Permet de limiter la recherche aux lieux qui sont actuellement ouverts. Pour en savoir plus, consultez SearchByTextRequest.isOpenNow et PlaceTextSearchRequestElement.isOpenNow.
locationBias optional
Type : LocationBias optional
Biais de localisation pour la recherche. Pour en savoir plus, consultez SearchByTextRequest.locationBias et PlaceTextSearchRequestElement.locationBias.
locationRestriction optional
Restriction de l'emplacement pour la recherche. Pour en savoir plus, consultez SearchByTextRequest.locationRestriction et PlaceTextSearchRequestElement.locationRestriction.
maxResultCount optional
Type : number optional
Nombre maximal de résultats à renvoyer. Pour en savoir plus, consultez SearchByTextRequest.maxResultCount et PlaceTextSearchRequestElement.maxResultCount.
minRating optional
Type : number optional
Excluez les résultats dont la note moyenne des utilisateurs est strictement inférieure à cette limite. Pour en savoir plus, consultez SearchByTextRequest.minRating et PlaceTextSearchRequestElement.minRating.
priceLevels optional
Type : Array<PriceLevel> optional
Permet de limiter la recherche aux lieux marqués comme correspondant à certains niveaux de prix. Pour en savoir plus, consultez SearchByTextRequest.priceLevels et PlaceTextSearchRequestElement.priceLevels.
rankPreference optional
Comment les résultats seront classés dans la réponse. Pour en savoir plus, consultez SearchByTextRequest.rankPreference et PlaceTextSearchRequestElement.rankPreference.
textQuery optional
Type : string optional
Requête textuelle pour la recherche textuelle. Pour en savoir plus, consultez SearchByTextRequest.textQuery et PlaceTextSearchRequestElement.textQuery.
useStrictTypeFiltering optional
Type : boolean optional
Permet de définir un filtrage de type strict pour SearchByTextRequest.includedType. Pour en savoir plus, consultez SearchByTextRequest.useStrictTypeFiltering et PlaceTextSearchRequestElement.useStrictTypeFiltering.

Classe Autocomplete

Classe google.maps.places.Autocomplete

Widget qui fournit des prédictions de lieux en fonction de la saisie de texte d'un utilisateur. Il s'associe à un élément d'entrée de type text et écoute la saisie de texte dans ce champ. La liste des prédictions est présentée sous la forme d'une liste déroulante et est mise à jour à mesure que du texte est saisi.

Cette classe étend MVCObject.

Accédez-y en appelant const {Autocomplete} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
Autocomplete
Autocomplete(inputField[, opts])
Paramètres : 
Crée une instance de Autocomplete qui s'associe au champ de saisie de texte spécifié avec les options données.
getBounds
getBounds()
Paramètres : aucun
Valeur renvoyée : LatLngBounds|undefined Les limites de pondération.
Renvoie les limites vers lesquelles les prédictions sont biaisées.
getFields
getFields()
Paramètres : aucun
Valeur renvoyée : Array<string>|undefined
Renvoie les champs à inclure pour le lieu dans la réponse de détails lorsque les détails sont récupérés. Pour obtenir la liste des champs, consultez PlaceResult.
getPlace
getPlace()
Paramètres : aucun
Valeur renvoyée : PlaceResult Le lieu sélectionné par l'utilisateur.
Renvoie les détails du lieu sélectionné par l'utilisateur si les détails ont bien été récupérés. Sinon, renvoie un objet Place stub, avec la propriété name définie sur la valeur actuelle du champ de saisie.
setBounds
setBounds(bounds)
Paramètres : 
Valeur renvoyée : aucune
Définit la zone préférée dans laquelle renvoyer les résultats de lieux. Les résultats sont pondérés en faveur de cette zone, mais n'y sont pas restreints.
setComponentRestrictions
setComponentRestrictions(restrictions)
Paramètres : 
Valeur renvoyée : aucune
Définit les restrictions de composants. Les restrictions de composants permettent de limiter les prédictions à celles du composant parent. Par exemple, le pays.
setFields
setFields(fields)
Paramètres : 
  • fields : Array<string> optional
Valeur renvoyée : aucune
Définit les champs à inclure pour le lieu dans la réponse de détails lorsque les détails sont récupérés. Pour obtenir la liste des champs, consultez PlaceResult.
setOptions
setOptions(options)
Paramètres : 
Valeur renvoyée : aucune
setTypes
setTypes(types)
Paramètres : 
  • types : Array<string> optional types de prédictions à inclure.
Valeur renvoyée : aucune
Définit les types de prédictions à renvoyer. Pour connaître les types acceptés, consultez le guide du développeur. Si aucun type n'est spécifié, tous les types seront renvoyés.
Héritées : addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
place_changed
function()
Arguments : aucun
Cet événement est déclenché lorsqu'un PlaceResult est disponible pour un lieu sélectionné par l'utilisateur.
Si l'utilisateur saisit le nom d'un lieu qui n'a pas été suggéré par le contrôle et appuie sur la touche Entrée, ou si une requête Place Details échoue, PlaceResult contient l'entrée de l'utilisateur dans la propriété name, sans qu'aucune autre propriété ne soit définie.

Interface AutocompleteOptions

google.maps.places.AutocompleteOptions interface

Options pouvant être définies sur un objet Autocomplete.
bounds optional
Zone dans laquelle rechercher des lieux.
componentRestrictions optional
Type : ComponentRestrictions optional
Restrictions liées aux composants. Les restrictions de composants permettent de limiter les prédictions à celles du composant parent. Par exemple, le pays.
fields optional
Type : Array<string> optional
Champs à inclure pour le lieu dans la réponse de détails lorsque les détails sont récupérés avec succès, qui seront facturés. Si ['ALL'] est transmis, tous les champs disponibles sont renvoyés et facturés (non recommandé pour les déploiements de production). Pour obtenir la liste des champs, consultez PlaceResult. Les champs imbriqués peuvent être spécifiés avec des chemins d'accès séparés par des points (par exemple, "geometry.location"). La valeur par défaut est ['ALL'].
placeIdOnly optional
Type : boolean optional
Indique si seuls les ID de lieu doivent être récupérés. Le PlaceResult mis à disposition lorsque l'événement place_changed est déclenché ne comportera que les champs place_id, types et name, avec les champs place_id, types et description renvoyés par le service Autocomplete. Désactivé par défaut
strictBounds optional
Type : boolean optional
Valeur booléenne indiquant que le widget Autocomplete ne doit renvoyer que les lieux situés dans les limites du widget Autocomplete au moment de l'envoi de la requête. Si vous définissez strictBounds sur false (valeur par défaut), les résultats seront pondérés en faveur des lieux situés entre ces limites, mais n'y seront pas restreints.
types optional
Type : Array<string> optional
Types de prédictions à renvoyer. Pour connaître les types acceptés, consultez le guide du développeur. Si aucun type n'est spécifié, tous les types seront renvoyés.

Classe google.maps.places.SearchBox

Widget qui fournit des prédictions de requête en fonction de la saisie de texte d'un utilisateur. Il s'associe à un élément d'entrée de type text et écoute la saisie de texte dans ce champ. La liste des prédictions est présentée sous la forme d'une liste déroulante et est mise à jour à mesure que du texte est saisi.

Cette classe étend MVCObject.

Accédez-y en appelant const {SearchBox} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
SearchBox
SearchBox(inputField[, opts])
Paramètres : 
Crée une instance de SearchBox qui s'associe au champ de saisie de texte spécifié avec les options données.
getBounds
getBounds()
Paramètres : aucun
Valeur renvoyée : LatLngBounds|undefined
Renvoie les limites vers lesquelles les prédictions de requête sont biaisées.
getPlaces
getPlaces()
Paramètres : aucun
Valeur renvoyée : Array<PlaceResult>|undefined
Renvoie la requête sélectionnée par l'utilisateur à utiliser avec l'événement places_changed.
setBounds
setBounds(bounds)
Paramètres : 
Valeur renvoyée : aucune
Définit la région à utiliser pour biaiser les prédictions de requête. Les résultats seront pondérés en faveur de cette zone, mais ne s'y limiteront pas.
Héritées : addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
places_changed
function()
Arguments : aucun
Cet événement est déclenché lorsque l'utilisateur sélectionne une requête. getPlaces doit être utilisé pour obtenir de nouveaux lieux.

SearchBoxOptions

google.maps.places.SearchBoxOptions interface

Options pouvant être définies sur un objet SearchBox.
bounds optional
Zone vers laquelle orienter les prédictions de requête. Les prédictions sont pondérées en faveur des requêtes ciblant ces limites, mais n'y sont pas restreintes.

Classe PlaceContextualElement

Classe google.maps.places.PlaceContextualElement

Widget qui utilise le jeton de contexte pour afficher une vue contextuelle de la réponse de l'ancrage avec Google Maps.

Élément personnalisé :
<gmp-place-contextual context-token="string"></gmp-place-contextual>

Cette classe étend HTMLElement.

Cette classe implémente PlaceContextualElementOptions.

Accédez-y en appelant const {PlaceContextualElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
PlaceContextualElement
PlaceContextualElement([options])
Paramètres : 
contextToken
Type : string optional
Jeton de contexte.
Attribut HTML :
  • <gmp-place-contextual context-token="string"></gmp-place-contextual>
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.

Interface PlaceContextualElementOptions

google.maps.places.PlaceContextualElementOptions interface

Options pour PlaceContextualElement.
contextToken optional
Type : string optional
Jeton de contexte fourni par la réponse d'ancrage avec Google Maps.

Classe PlaceContextualListConfigElement

Classe google.maps.places.PlaceContextualListConfigElement

Élément HTML qui configure les options de la vue sous forme de liste de l'élément contextuel de lieu.

Élément personnalisé :
<gmp-place-contextual-list-config layout="compact" map-hidden></gmp-place-contextual-list-config>

Cette classe étend HTMLElement.

Cette classe implémente PlaceContextualListConfigElementOptions.

Accédez-y en appelant const {PlaceContextualListConfigElement} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
PlaceContextualListConfigElement
PlaceContextualListConfigElement([options])
Paramètres : 
layout
Type : PlaceContextualListLayout optional
La mise en page.
Attribut 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
Type : boolean optional
Indique si la carte est masquée.
Attribut HTML :
  • <gmp-place-contextual-list-config map-hidden></gmp-place-contextual-list-config>
addEventListener
addEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne sensible à la casse représentant le type d'événement à écouter.
  • listener : EventListener|EventListenerObject Objet qui reçoit une notification. Il doit s'agir d'une fonction ou d'un objet avec la méthode handleEvent
  • options : boolean|AddEventListenerOptions optional Consultez les options. Les événements personnalisés ne sont compatibles qu'avec capture et passive.
Valeur renvoyée : void
Configure une fonction qui sera appelée chaque fois que l'événement spécifié est envoyé à la cible. Consultez addEventListener.
removeEventListener
removeEventListener(type, listener[, options])
Paramètres : 
  • type : string Chaîne qui spécifie le type d'événement pour lequel supprimer un écouteur d'événements.
  • listener : EventListener|EventListenerObject l'écouteur d'événements du gestionnaire d'événements à supprimer de la cible de l'événement.
  • options : boolean|EventListenerOptions optional Consultez les options.
Valeur renvoyée : void
Supprime de la cible un écouteur d'événements précédemment enregistré avec addEventListener. Consultez removeEventListener.

PlaceContextualListConfigElementOptions

google.maps.places.PlaceContextualListConfigElementOptions interface

Options pour PlaceContextualListConfigElement.
layout optional
Type : PlaceContextualListLayout optional
Par défaut : PlaceContextualListLayout.VERTICAL
La mise en page.
mapHidden optional
Type : boolean optional
Par défaut : false
"True" si la carte doit être masquée.

Constantes PlaceContextualListLayout

google.maps.places.PlaceContextualListLayout constantes

Liste des mises en page compatibles avec l'élément contextuel de lieu pour la vue sous forme de liste.

Accédez-y en appelant const {PlaceContextualListLayout} = await google.maps.importLibrary("places").
Consultez Bibliothèques de l'API Maps JavaScript.
COMPACT Disposition en liste compacte : les éléments de la liste sont affichés sous forme de liens sur une seule ligne, avec des dépassements dans une liste déroulante.
VERTICAL Disposition en liste verticale : les éléments de la liste sont affichés sous forme de fiches dans une liste verticale.