Vous avez trouvé ce tutoriel intéressant ? Recommandez le en cliquant sur le bouton +1    

Initialiser une carte Google Maps

Tutoriel publié le Mis à jour le
Tutoriel en Français

Cette fonction vous permet d'afficher une carte Google Maps à l'aide de paramètres.

init

  • Paramètres spécifiques : aucun
  • Nom de stockage : map
  • Résultat du callback : google.maps.Map
  
$('#maCarte').gmap3(
	{
		action: 'init',
		options:{
			center:[22.49156846196823, 89.75802349999992],
			zoom:2,
			mapTypeId: google.maps.MapTypeId.SATELLITE,
			mapTypeControl: true,
			mapTypeControlOptions: {
				style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
			},
			navigationControl: true,
			scrollwheel: true,
			streetViewControl: true
		}
	}
);

Carte avec init

Code complet avec init

<!DOCTYPE html>
<html lang="fr">
	<head>
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
		<meta charset="UTF-8"/>
		<title>Votre titre de page</title>
		<style type="text/css">
			html{height:100%}
			body{height:100%;margin:0px;padding:0px}
			#maCarte{height: 100%;}
		</style>
		<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
		<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
		<script type="text/javascript" src="http://www.votredomaine.fr/js/gmap3.js"></script>
		<script type="text/javascript"> 
			$(function(){
				$('#maCarte').gmap3(
					{
						action: 'init',
						options:{
							center:[22.49156846196823, 89.75802349999992],
							zoom:2,
							mapTypeId: google.maps.MapTypeId.SATELLITE,
							mapTypeControl: true,
							mapTypeControlOptions: {
								style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
							},
							navigationControl: true,
							scrollwheel: true,
							streetViewControl: true
						}
					}
				);
			});
		</script>
	</head>
	
	<body>
		<div id="maCarte"></div>
	</body>
</html>

 

Source

init

Résumé

GMap3 Plugin JQuery : init

init