Apprenez comment ajouter une carte Google à une page Web.
Une page Web de base
Toutes page Web sont écrits en HTML.
Pour montrer comment ajouter une carte Google à une page web, nous utiliserons une page web de base simple:
Exemple
<!DOCTYPE html>
<html>
<body>
<h1>My First Google Map</h1>
<div id="map">My map will go here</div>
</body>
<html>
Essayez vous - même » Définissez la taille de la carte
Définissez la taille de la carte:
Ajouter l'API Google
La fonctionnalité de la carte est fournie par une bibliothèque JavaScript situé à Google.
La bibliothèque JavaScript peut être chargé dans le <head> section de la page HTML.
En fait , vous pouvez déposer les balises <head> et </head> tags.
Exemple
<head>
<script src="https://maps.googleapis.com/maps/api/js"></script>
</head>
Essayez vous - même » Créer la carte en utilisant JavaScript
Enfin, ajoutez le code JavaScript nécessaire à la page:
Exemple
var mapCanvas =
document.getElementById("map");
var mapOptions = {
center: new google.maps.LatLng(51.5, -0.2), zoom:
10
}
var map = new google.maps.Map(mapCanvas,
mapOptions); Essayez vous - même » exemple Explained
mapCanvas est l'élément HTML de la carte.
mapOptions est les options de la carte.
La propriété centre obtient la latitude et la longitude (de Londres) en appelant google.maps. LatLng() google.maps. LatLng() .
La propriété de zoom est réglé sur 10. (essayez d'expérimenter avec le zoom)
L'objet google.maps.Map est créé avec mapCanvas et mapOptions en tant que paramètres.
Accédez à notre API Google Maps Tutorial . pour en savoir plus sur Google Maps.