Calculer l'aire délimitée par un MVCArray de LatLng avec computeArea

Bibliothèque géométrie sphérique ( Geometry Library ) exemples et tutoriels en Français

Cartographie et webmapping

Partager ce tutoriel sur les réseaux sociaux
Signaler une erreur dans cet article

Calculer la surface avec computeArea des points LatLng contenus dans MVCArray

Pour calculer la surface ou aire délimitée par des points (LatLng) contenus dans un tableau MVCArray, il suffit d'appeler la méthode computeArea() de la bibliothèque Geometry Library.

La valeur retournée est un nombre {number}.

var surface = google.maps.geometry.spherical.computeArea( MVCArray );

Dans cet exemple nous allons calculer la surface ou aire délimitée par les 6 points (LatLng) contenus dans un tableau de type MVCArray et listés ci-dessous :

  • 1 - Tours ( FR ) : Latitude : 47.390912, Longitude : 0.670166
  • 2 - Dakar ( SN ) : Latitude 14.762931, Longitude : -17.339172
  • 3 - Djibouti ( DJ ) : Latitude 11.588847, Longitude : 43.146572
  • 4 - Moscou ( RU ) : Latitude 55.753395, Longitude : 37.626114
  • 5 - Reykjavík ( IS ) : Latitude 64.133529, Longitude : -21.898499
  • 6 - San Francisco ( US ) : Latitude 37.771529, Longitude : -122.427177
/**
 * Dans cet exemple on souhaite connaître l'aire
 * délimitée par les points (LatLng) contenus
 * dans d'un tableau de type MVCArray
 */
var MvcArray = new google.maps.MVCArray(); 
	MvcArray.push( new google.maps.LatLng( 47.390912,    0.670166 ) ); 
	MvcArray.push( new google.maps.LatLng( 14.762931,  -17.339172 ) ); 
	MvcArray.push( new google.maps.LatLng( 11.588847,   43.146572 ) ); 
	MvcArray.push( new google.maps.LatLng( 55.753395,   37.626114 ) ); 
	MvcArray.push( new google.maps.LatLng( 64.133529,  -21.898499 ) ); 
	MvcArray.push( new google.maps.LatLng( 37.771529, -122.427177 ) ); 
/**
 * Le résultat est affecté à la variable surface
 */
var surface = google.maps.geometry.spherical.computeArea(MvcArray);

Attention : n'oubliez pas d'ajouter la bibliothèque geometry lorsque vous appelez le script de l'API Google Maps v3 :

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=geometry"></script>

Carte avec calcul de la surface délimitée par les points LatLng contenus dans MVCArray

La carte affichée ci-dessus est donnée uniquement pour illustrer la surface que pourraient générer les LatLng contenues dans le MVCArray.
Surface délimitée par ces 6 points : m2

Exemple de code pour mesurer l'aire délimitée par les points LatLng contenus dans MVCArray

<!DOCTYPE html>
<html lang="fr">
<head>
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
	<meta charset="UTF-8" />
	<title>Titre de votre page</title>
	<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=geometry"></script>
	<script type="text/javascript">
		function initialisation(){
			var MvcArray = new google.maps.MVCArray(); 
				MvcArray.push(new google.maps.LatLng(47.390912,0.670166)); 
				MvcArray.push(new google.maps.LatLng(14.762931,-17.339172)); 
				MvcArray.push(new google.maps.LatLng(11.588847,43.146572)); 
				MvcArray.push(new google.maps.LatLng(55.753395,37.626114)); 
				MvcArray.push(new google.maps.LatLng(64.133529,-21.898499)); 
				MvcArray.push(new google.maps.LatLng(37.771529,-122.427177));
			var surface = google.maps.geometry.spherical.computeArea(MvcArray);
			document.getElementById('info').innerHTML = "Surface délimitée par ces 6 points : "+surface+" m2";
		}
		google.maps.event.addDomListener( window, "load", initialisation);
	</script>
</head>
<body>
	<div id="info"></div>
	<noscript>
		<p>Attention : </p>
		<p>Afin de pouvoir utiliser Google Maps, JavaScript doit être activé.</p>
		<p>Or, il semble que JavaScript est désactivé ou qu'il ne soit pas supporté par votre navigateur.</p>
		<p>Pour afficher Google Maps, activez JavaScript en modifiant les options de votre navigateur, puis essayez à nouveau.</p>
	</noscript>
</body>
</html>