Carto + GPS

• carte similaire (plus simple)
• données GPS seules
• Fonctions avancées Google Map

On charge l'API Google http://maps.google.com/maps/api/js?sensor=false par une simple balise de script et on inclut un div dont l'ID est "map" (définir width et height).
Pour afficher la carte, il faut définir une position par défaut, un type de carte et un niveau de zoom

// Position par défaut (Châtelet à Paris)
var positionInitiale = new google.maps.LatLng(48.579400,7.7519);

// Options relatives à la carte
var optionsDeLaCarte = {
    center:positionInitiale,
    mapTypeId: google.maps.MapTypeId.ROADMAP, // ROADMAP peut être remplacé par SATELLITE, HYBRID ou TERRAIN

    zoom: 15 // Zoom : 0 = terre entière, 19 = au niveau de la rue

};
 
// Initialisation de la carte pour l'élément portant l'id "map"
var map = new google.maps.Map(document.getElementById("map"), optionsDeLaCarte);
  

// Fonction de callback en cas de succès
var latlng

function geo_ok(position) {
 
    // Un nouvel objet LatLng (coordonées) pour Google Maps avec les paramètres de position
    latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
 
    // Ajout d'un marqueur à la position trouvée
    var marker = new google.maps.Marker({
      position: latlng,
      map: map,
      title:"Vous êtes ici"
    });
    
    // Permet de centrer la carte sur la position latlng
    map.panTo(latlng);
 
}