Exemple de comment intégrer une carte google dans une page HTML:
Table des matières
Créer une page html
Première étape, créons un simple page html :
<!doctype html>
<html>
<head>
<title>Embedding a google map</title>
</head>
<body>
</body>
</html>
Ajoutez maintenant entre les body tags :
<iframe
width="450"
height="450"
frameborder="0" style="border:0"
referrerpolicy="no-referrer-when-downgrade"
src="https://www.google.com/maps/embed/v1/view?key=my_api_key¢er=48.8584,2.2945&zoom=17&maptype=satellite"
allowfullscreen>
</iframe>
Remplacez my_api_key par votre clé api (voir Créer une clé API google map ci-dessous)
Pour obtenir plus d'informations sur les paramètres disponibles, consultez ce tutoriel
Remarque : consultez également la page google suivante: pricing. Pour l'API "google embedded map", il est illimité.
Créer une clé API Google Map
Pour intégrer une carte google il faut créer une clé API :
Remarque : pour des raisons de sécurité n'oubliez pas de modifier les restrictions d'application.
Activer l'API google map
Si la page html affiche le message d'erreur suivant :
Google Maps Platform rejected your request. This API project is not authorized to use this API.
C'est probablement parce que vous n'avez pas activé l'API "Maps Embed" de Google :
Chercher Maps Embed API click on it and click on the button Enable.
Références
Liens | Site |
---|---|
google cloud | /console.cloud.google.com |
Set Up in the Google Cloud Console | developers.google.com |