Plugin JQuery BMap, pour afficher simplement des Google Maps

Le plugin JQuery BMap permet un affichage et un contrôle ultra simple des Google Maps. Avec ce plugin, plus besoin de fouiller dans la doc de Google Maps, il ajout simplement une surcouche afin de contrôler les cartes plus facilement.

Comment ça marche ? C’est très simple, il suffit d’avoir chargé JQuery dans la page ainsi que le fichier de Google Maps (api v3 ou v2) et en quelques lignes, vous pouvez afficher une Google Map avec un ou plusieurs marqueur(s) dessus :

$("#map1").bMap({ // map1 et l'ID du div qui va recevoir la carte
	mapZoom: 11, // niveau de zoom par défaut de la carte 
	mapCenter:[51.501690392607,-0.1263427734375], // latitude et longitude du centre de la carte
	markers:{"data":[ // création de marqueurs dès le chargement de la page
		{
			"lat":51.49757618329838, // latitude du 1er marqueur
			"lng":-0.1746654510498047,  // longitude du 1er marqueur
			"title":"Science Museum",  // titre à afficher dans l'infobulle
			"body":"Exhibition Road, London SW7" // contenu à afficher dans l'infobulle
		},{ // 2è marqueur :
			"lat":51.47769451182406,
			"lng":-0.0009441375732421875, 
			"title":"Royal Observatory Greenwich", 
			"body":"Blackheath Ave, Greenwich, London SE10"
		}	// et on peut ajouter autant de marqueurs que l'on veut...
	]}
});

Ce n’est pas plus compliqué que ça. Il est proposé environ dix options pour afficher juste la carte, après on en trouve d’autres pour les marqueurs, des méthodes AJAX pour l’affichage de zone (polygone ou autre). A noter que l’on quand même se servir d’autres méthodes proposées par Google même en utilisant le plugin.

Ce plugin JQuery reste néanmoins juste une alternative pour afficher et contrôler des Google Maps simples. Je ne pense pas que ce soit l’idéal pour des cartes avec plein d’options de contrôle.

Pas encore de billet sur le même sujet !