Technologie de l'information et de la communication

Disponible uniquement sur Etudier
  • Pages : 9 (2116 mots )
  • Téléchargement(s) : 0
  • Publié le : 18 mai 2010
Lire le document complet
Aperçu du document
Bienvenue sur mon premier tutoriel [pic]!

Je vais vous expliquer dans ce tutoriel comment intégrer une carte Google Maps à votre site, et vous décrire les fonctions que vous pouvez ajouter à votre carte. Pour aborder le tutoriel il faut connaître un minimum de PHP...
Google a une API Javascript pour Google Maps, mais dans ce tutoriel on ne verra pas cette API Javascript de Google, mais uneclasse PHP qui génère ce Javascript. J'ai retravaillé cette classe PHP pour que le code généré soit aux normes W3C.
Donc si vous ne connaissez rien au Javascript et que vous voulez quand même une belle carte de Google Maps, alors ce tutoriel est pour vous.

J'espère que ce tutoriel vous plaira et qu'il vous sera utile. N'hésitez pas à donner vos avis et vos conseils dans les commentaires pourque je puisse l'améliorer.

C'est parti !
Sommaire du tutoriel :
• Présentation de Google Maps
• Votre première carte
• Les caractéristiques applicables à votre carte

Présentation de Google Maps

On va commencer de zér0 et voir ensemble ce qu'est Google Maps et ce que l'on peut réussir à réaliser à la fin de ce tutoriel.

Tout d'abord, Google Maps est une plateformedéveloppée par le géant américain Google qui génère une carte mondiale. Vous pouvez rechercher un lieu dans le monde entier ou encore tracer des trajets entre deux lieux. Mais il ne s'arrête pas là, en proposant des vues différentes comme :
• La vue plan
• La vue satellite
• La vue relief

Vous l'aurez compris, Google Maps possède de nombreuses compétences intégrées à sa plateforme etce tutoriel va vous expliquer comment intégrer une carte à votre site web. Vous pourrez ainsi placer des pointeurs à partir d'une latitude et d'une longitude, ou mieux encore, à partir d'une adresse postale ! Il est fort ce Google [pic]!

Voici ci-dessous une carte de Google Maps. C'est ce genre de carte que vous pourrez intégrer à vos sites :

Les cartes de Google Maps peuvent vous être d'unegrande utilité pour rendre dynamique votre site et "gadgeter" un peu votre page web !

Il faut savoir que Google Maps n'est pas à la base de cette API Php, et que pour créer une carte il faut utiliser le Javascript.
Quoi ? Mais je ne connais pas le Javascript...

C'est pour cela que cette API PHP a été développée. Elle a pour but de vous générer le code Javascript sans que vous vous enrendiez compte

Voici quand même la documentation de l'API Javascript de Google, qui peut servir pour les fans du Javascript !

Votre première carte

Comme je vous l'ai déjà dit précédemment, nous allons utiliser une classe Php de Google Maps appelée "GoogleMapAPI V2.5".

Euh, c'est quoi cette classe PHP ?

Cette classe va nous permettre d'appeler des méthodes (quasi similaire à desfonctions PHP pour faire simple) et celles-ci vont s'occuper de tout pour générer un code Javascript qui sera votre belle carte !

Pour cela, il faut télécharger cette classe PHP : "GoogleMapAPI V2.5".

La seconde étape consiste à obtenir la clef de Google pour utiliser ce script.

C'est payant, tu aurais pu nous le dire !

Absolument pas ! Google a juste créé cette protection pour que vousvalidiez les conditions générales d'utilisation de cette API.

Il vous suffit d'aller sur la page de Google Maps qui va vous générer gratuitement votre clef Google en fonction de l'adresse URL que vous aurez entrée.

Remarque : si vous mettez une adresse se terminant dans un dossier, par exemple : http://www.siteduzero.com/dossier/
La carte Google pourra être affichée dans tous les fichiers dece dossier, dans notre exemple :
http://www.siteduzero.com/dossier/super.php ou http://www.siteduzero.com/dossier/index.php

Cette remarque pourra être utile pour toutes les personnes qui désirent afficher des cartes dans différentes pages !

Vous allez donc vous retrouver avec une clef unique à votre site une fois que vous aurez entré l'URL du site et accepté les conditions générales...
tracking img