Utiliser les Google Maps

1. Demander une clé API auprès de Google

2. Placer le script fourni par Google dans le header de votre page. (Enlever le paramètre sensor : supprimer "sensor=true_or_false&"

3. Ajouter ce script dans le header en remplaçant les coordonnées GPS (la latitude et la longitude du lieu et celles pour centrer la carte) par les vôtres :
<script type="text/JavaScript"> var geocoder = null; function load() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map")); map.setCenter(new GLatLng(43.8086413832034, 4.043322801589966), 11); geocoder = new GClientGeocoder(); map.addControl(new GScaleControl()); var customUI = map.getDefaultUI(); customUI.maptypes.satellite = false; customUI.maptypes.hybrid = false; customUI.maptypes.physical = false; map.setUI(customUI); var point = new GLatLng(43.8086413832034, 4.043322801589966); map.addOverlay(new GMarker(point)); }else { alert("Désolé, mais votre navigateur n\'est pas compatible avec Google Maps"); } } </script>

4. Remplacer la balise body par :
<body onload="load()" onunload="GUnload()">
Placer la balise map à l'endroit de votre page où vous voulez voir s'afficher votre carte :
<div id="map" style="width:400px;height:400px"> </div>

5. Personnalisation de la carte : les contrôles.
A l'aide de la fonction addControl, dans le script, vous pouvez ajouter des contrôles sur la carte :
- GLargeMapControl() : contrôle le plus complet pour se diriger et zoomer
- GOverviewMapControl() : petite carte en bas à droite de la région élargie
- GScaleControl() : l’échelle de la carte
- GMapTypeControl() : Plan / Satellite / Mixte

Liens

fleche Obtenir une clé API pour les Google maps
fleche Trouver les coordonnées GPS d'un lieu : latitude et longitude sous forme décimale

fleche Configurez, installez, placez Google Maps aisément sur votre site...

Exemples

fleche Le Guide des Commerciaux

fleche Sites touristiques du Gard