logo image
AddThis Social Bookmark Button

Visualisation d'une page Webjax

Les bases de GMaps
icone addfav
Si vous suivez les exemples de GMaps, vous avez déjà pu consulter le premier exemple d'utilisation page 139 qui présente succintement les bases d'utilisation de cartes GMaps.

Cette page a pour objectif d'aller un peu plus loin dans cette présentation en vous pemettant d'entrevoir les sujets abordés dans les prochaines pages de description de GMaps.

La base de GMaps est l'objet GMap ou GMap2 selon la version de la librairie utilisée.
Cet objet peut être centré sur des points ( ou objet GPoint ) , peut afficher des marqueurs ( ou GMarker ) sur des dits points, ....
L'objet GMap (ou carte) peut se voir ajouter des "contrôles" d'affichage. Ces contrôles d'affichage permettent par exemple de naviguer entre les différentes vues d'une carte GMap ) savoir "NORMAL" c'est à dire sous forme de plan de carte routière avec noms des rues et zones colorisées, "SATELLITE" c'est à dire une vue crée à partir d'images satellites donc dénuée d'informations textuelles,  "HYBRID" c'est à dire un mélange entre la vue "SATELLITE" et la vue "NORMAL" ( vue satellite avec overlays représentant les routes et les noms de rue).

Comme nous avons affaire à un script produit par Google, comme nous sommes dans le cadre de programmation objet, comme l'objectif et les possibilités d'une application comme GMaps sont très grands, il est possible de rentrer le détail de chaque fonctionnalité exprimée ci dessus via les objets et méthodes/propriétés prévues à cet effet dans la librairie GMaps.

Cette page n'a cependant pas pour objectif de présenter toutes les fonctionnalités d'un seul coup au risque de provoquer chez les plus fébriles d'entre vous une indigestion ;-)

Vous retrouverez donc dans la suite de cette page des exemples basiques d'utilisation qui vous donne un aperçu global de ce que vous allez pouvoir manipuler avec la librairie GMaps.


!!! : il est à noter que la librairie Prototype.js est incluse à partir de cet instant dans la page afin de pouvoir contrôler de façon efficace les valeurs saisies pour la personnalisation des exemples de cette page.





Carte GMap centrée par rapport à un point


Ce premier exemple d'utilisation basique des GMaps vous permet de charger une carte centrée sur un point précisé.
Un point correspond à une latitude et à une longitude, valeurs utilisées pour positionner des points sur des mappes mondes et autres cartes en version papier.
Les points proposés correspondent à des villes françaises (ndr : version fr de webjax).

L'exemple est testable ci après :

Utilisation de l'exemple #00 Point Centrage / Ville :

ZONE DE CHARGEMENT DE LA CARTE GMAPS




Le code source de l'exemple est présenté ci après :

Le code ci après présente la définition de la fonction javascript qui travaille à partir des coordonnées reçues depuis la liste déroulante pour afficher la carte centrée sur la ville sélectionnée.




Carte GMap avec marqueurs


Ce deuxième exemple présentant les fonctionnalités basiques des cartes GMaps, permet d'afficher une carte de France avec des marqueurs placés sur différentes villes (ndr : voir exemple 0 de cette page pour liste des villes affichées).

L'exemple est testable ci après :

ZONE DE CHARGEMENT DE LA CARTE GMAPS




Le code source de cet exemple est repris ci après avec dans l'ordre :
  • le code javascript inclus pour permettre la création des marqueurs et de la carte
  • le code html du bouton qui appelle la fonction javascript



Le code html du bouton appelant la fonction chargerCarteAvecMarqueur () :

ico com Aucun commentaire enregistré