Ce composant n'est pas compatible avec les annonces Google Ads, Google AdMob, AMP HTML, vidéo ni illustrées.
Le composant "Carte" vous permet d'afficher une carte interactive personnalisée.
Depuis le 11 juin 2018, vous devez activer la facturation pour Google Cloud Platform et vous servir d'une clé d'API Google Maps Platform valide pour tous les projets qui utilisent les composants "Carte" et "Street View". En savoir plus
Pour ajouter le composant "Carte" à votre projet, procédez comme suit :
- Ouvrez le panneau Composants, puis le dossier Cartes.
- Faites glisser le composant Carte
dans l'espace de création.
- Dans la section regroupant les propriétés du composant Carte du panneau Propriétés, saisissez votre clé API Google Maps Platform dans le champ Clé API Google.
- Indiquez les propriétés de latitude et de longitude pour définir le point central par défaut de la carte. Découvrez ici comment trouver les coordonnées d'un lieu sur Google Maps. Vous pouvez également cocher la case Demander la position de l'utilisateur pour demander à l'utilisateur de communiquer son emplacement de façon à l'indiquer sur la carte.
- Si vous souhaitez ajouter sur la carte des repères pour des lieux précis, vous pouvez saisir un terme de recherche.
Propriétés
| Propriété | Description |
|---|---|
| Nom | Nom du composant. |
| Clé d'API Google (obligatoire) | Votre clé API Google Maps Platform. L'API Maps JavaScript doit être activée dans le projet Google Cloud Platform associé à cette clé API. Cette propriété peut être associée à des données dynamiques. |
| Terme de recherche | Terme de recherche à utiliser. Les lieux correspondants sont affichés sur la carte à l'aide de repères. Assurez-vous que l'API Places est activée pour votre projet Google Cloud Platform. Cette propriété peut être associée à des données dynamiques. |
| Latitude | Latitude de votre position centrale par défaut sur la carte. Cette propriété peut être associée à des données dynamiques. |
| Longitude | Longitude de votre position centrale par défaut sur la carte. Cette propriété peut être associée à des données dynamiques. |
| Demander la position de l'utilisateur | Cochez cette case pour demander à l'utilisateur sa position. Assurez-vous que l'API Geocoding est activée pour votre projet Google Cloud Platform afin de permettre aux utilisateurs de saisir une adresse. Cette propriété peut être associée à des données dynamiques. |
Propriétés avancées
Cliquez sur l'icône de développement à côté de Propriétés avancées dans le panneau des propriétés du composant pour modifier les propriétés avancées suivantes :
| Propriété | Description |
|---|---|
| Identifiant de table de fusion (obsolète) |
Google Fusion Tables ne sera plus disponible à compter du 3 décembre 2019. |
| ID du client Maps Premier (obsolète) | ID client des utilisateurs de Google Maps Premier. La nouvelle tarification sera appliquée aux clients ayant souscrit un forfait Premium Google Maps à l'expiration de leur contrat. Ils devront alors utiliser une clé API Google Maps Platform. Cette propriété peut être associée à des données dynamiques. |
| Rayon de recherche | Rayon (en mètres) de la zone dans laquelle effectuer les recherches, centré sur une latitude et une longitude spécifiques ou sur l'emplacement de l'utilisateur. Les valeurs peuvent aller de 1 000 à 50 000. Cette propriété peut être associée à des données dynamiques. |
| Nombre maximal de résultats | Nombre maximal de résultats de recherche présentés à l'utilisateur en cas de recours à Google Fusion Tables. Cette propriété peut être associée à des données dynamiques. |
| Zoom par défaut |
Niveau de zoom par défaut pour la carte. La liste suivante indique le niveau de détail approximatif que vous pouvez vous attendre à voir à chaque niveau de zoom :
Cette propriété peut être associée à des données dynamiques. |
| Icône de repère | URI d'une icône de repère personnalisée, si vous choisissez de remplacer le repère par défaut. L'image source du repère doit être un sprite semblable à ceci : 
Deux icônes de repère sont nécessaires dans l'ordre suivant :
Cette propriété peut être associée à des données dynamiques. |
| Icône de position | URI d'une icône personnalisée indiquant l'emplacement de l'utilisateur, si vous choisissez de remplacer l'icône par défaut. Cette propriété peut être associée à des données dynamiques. |
| Texte invitant l'utilisateur à indiquer sa position | Texte personnalisé permettant de demander à l'utilisateur comment il souhaite déterminer sa position. Par défaut, le texte indique "How would you like us to get your position?". Le texte du bouton permettant de sélectionner le GPS ainsi que le texte du bouton permettant de choisir d'effectuer une recherche sont ensuite présentés à l'utilisateur. Cette propriété peut être associée à des données dynamiques. |
| Texte du bouton pour sélectionner le GPS | Texte personnalisé du bouton permettant de déterminer la position de l'utilisateur à l'aide du GPS. Voici le texte par défaut : "Use GPS". Cette propriété peut être associée à des données dynamiques. |
| Texte du bouton pour choisir d'effectuer une recherche | Texte personnalisé du bouton permettant d'afficher un champ de recherche pour déterminer la position de l'utilisateur. Voici le texte par défaut : "Enter address". Cette propriété peut être associée à des données dynamiques. |
| Texte invitant l'utilisateur à effectuer une recherche | Texte personnalisé invitant à rechercher une position Voici le texte par défaut : "Enter your address or zip code". Cette propriété peut être associée à des données dynamiques. |
| Texte expliquant le champ de recherche | Espace réservé correspondant au texte personnalisé du champ de recherche Voici le texte par défaut : "Address or zip code". Cette propriété peut être associée à des données dynamiques. |
| Texte du message d'erreur lié à la position | Texte personnalisé du message renvoyé lorsque la position est introuvable Voici le texte par défaut : "Your location could not be determined. Please enter a valid address.". Cette propriété peut être associée à des données dynamiques. |
| Texte à afficher lorsqu'il n'y a aucun résultat | Texte personnalisé du message renvoyé si aucun résultat n'est trouvé pour la position indiquée Voici le texte par défaut : "No results found near you.". Cette propriété peut être associée à des données dynamiques. |
Événements et actions
Événements envoyés par le composant "Carte"Vous pouvez déclencher d'autres actions en fonction de l'événement suivant du composant "Carte" :
| Événement | Description |
|---|---|
| Événement CLICK lié à un repère | Envoyé lorsque l'utilisateur clique sur un repère de position sur la carte. |
Pour sélectionner cet événement dans la boîte de dialogue Événement, définissez le composant "Carte" en tant que cible.
L'action suivante du composant "Carte" peut être déclenchée en réponse à d'autres événements :
| Action | Options de configuration |
|---|---|
| Définir le centre du plan |
|
Lorsque vous sélectionnez cette action dans la boîte de dialogue Événement, définissez le composant "Carte" en tant que destinataire.
Découvrez comment configurer des événements.
Aperçu
Il n'est pas possible de prévisualiser ce composant dans l'interface de Google Web Designer. Pour voir comment le composant s'exécute, prévisualisez votre document dans votre navigateur préféré en cliquant sur Aperçu 