Enseignement > Web dynamique > TP n°9 - Google maps  

Le but de ce TP est de réaliser des cartes interactives à partir du fond de cartes et d'images satellites de Google Maps, qui sert également de base à Google Earth : Google Maps permet de visualiser des cartes simplement depuis un navigateur WEB, grâce aux techniques "Ajax", alors que Google Earth est un logiciel à télécharger et à installer sur son PC.

Google met à dispositon des webmasters une "API" permettant d'utiliser Google Maps, pourvu que le webmaster s'inscrive et obtienne une "clé" lui permettant d'inclure cette API dans ses pages WEB.
Cette API vous servira de base technique au cours de ce TP; étudiez donc attentivement les examples et les possibilités qui vous sont ainsi offertes. 

Pour utiliser l'API de Google Maps, une clé est demandée. Utiliser la clé suivante :

AIzaSyA8NXZ5RSDDHwvUfTMY1wB6iQ6VQxxmFas
 

1ère question

Reprenez le premier exemple de Google
https://developers.google.com/maps/documentation/javascript/tutorial?hl=fr
Publiez votre première carte et testez-la.

Adaptez votre code pour centrer la carte sur votre salle de TP (latitude : 5.9875 - longitude : 47.2456), l'afficher sous forme d'image satellite et ajouter les controles permettant de zoomer.

2ème question
Ajouter à votre page le code nécessaire à l'affichage, sous la carte, de la latitude et de la longitude du point qui est cliqué sur la carte.
Ajouter ensuite à votre page le code nécessaire pour centrer la carte sur un point dont la latitude et la longitude sont saisies dans un formulaire.
Après avoir centré la carte sur ce nouveau point, ajouter sur la carte une icone à la position de ce point.
Déclencher l'ouverture d'une bulle d'information lorsqu'on clique sur ce point. Le texte d'information de la bulle aura préalablement été saisi dans le formulaire.

3ème question
Ecrire un formulaire permettant la saisie successive de plusieurs points. Relier ces points par un polygone sur la carte.

 

SOLUTION