Cette fonction permet d'optimiser l'affichage d'une carte (centre et niveau de zoom) afin que chaque élément qu'elle contient soit visible (marqueurs, cercles, polylines, etc.)
autoFit
- Paramètres spécifiques : aucun
Cet exemple ajoute un cercle sur la carte, puis centre et zoom la carte afin d'optimiser l'affichage du cercle.
Cette fonction n'ayant pas de paramètre, on peut l'appeler en mode "string" (sans l'objet action) comme dans l'exemple ci-dessous :
Carte avec autoFit
Code complet avec autoFit
<!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: 'addCircle',
options: {
center: [47.390164 ,0.688823],
radius : 2500000,
fillColor : "#008BB2",
strokeColor : "#005BB7"
}
},
"autofit" // autre écriture possible {action:"autofit"}
);
});
</script>
</head>
<body>
<div id="maCarte"></div>
</body>
</html>