GMap3 – Plugin jQuery pour API Google Maps 3ème version

Je vais vous reparler du Plugin GMAP3 pour jQuery, qui permet une utilisation simplifiée et en jQuery de l’API Google Maps Javascript Version 3. C’est un plugin que j’ai déjà présenté 2 fois sur ce blog, ici et . A l’heure où j’écris ces quelques lignes la version 4.1 de ce plugin est sortie et disponible directement sur le site du plugin GMAP3 ici.

gmap3-googlemaps-jquery-plugin-api

Pour rappel, GMAP3 c’est quoi ?

GMAP3 c’est un plugin jQuery qui va vous permettre de nombreuses manipulations de l’API Google Maps JavaScript version 3.

Utilisation du plugin jQuery :

Dans un premier temps inclure toutes les librairies nécessaires dans le head de votre fichier comme ceci :

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="gmap3.min.js"></script>

Pour l’exemple on va utiliser le plugin dans sa version la plus basique :

$("#maCarte").gmap3();

Ensuite un peu de CSS pour le bloc qui aura l’ID maCarte et qui est la cible de notre exemple :

#maCarte{
    height: 350px;
    width: 100%;
}

Puis pour finir notre bloc avec l’ID maCarte :

<div id="maCarte"></div>

Et là vous devriez voir apparaitre un élément Google Maps dans votre div représentant le monde, et en toute logique centré sur le pays où vous vous trouvez.

Quelques particularités apportées par ce plugin parmi beaucoup d’autres :

– Multi-instance (plusieurs cartes Google dans une même page web)
– Chaînable (comme tout autre plugin JQuery)
– Full JQuery
– Full Google Maps (il permet d’utiliser toutes les fonctionnalités natives à l’API Google Maps 3)
– Contextuel (via this qui se réfère au bloc qui reçoit la map)
– etc…

Je vous laisse donc découvrir le site officiel du Plugin jQuery GMAP3 et une version Française (non-officiel) sur cette page.

Vous retrouverez toutes les informations et possibilités sur ces 2 sites.

Bon code à tous 😉

Articles qui peuvent vous intéresser :

Comments
  1. id meneo
  2. Simo
  3. LudiKadmin

Leave a Reply

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *


*