NoSmoking 2012-06-01
Le 21 February 2012, il a été ajouté à la version 3.8 de l'API les méthodes suivantes :
google.maps.geometry.poly.containsLocation()
;
google.maps.geometry.poly.isLocationOnEdge()
.
Plus exactement, ces deux méthodes ont été ajoutées à la librairie geometry et sont liées au
namespace google.maps.geometry.poly
.
Cette librairie n'étant pas chargée par défaut, il ne faut pas oublier de l'intégrer à votre document.
<script src="//maps.googleapis.com/maps/api/js?sensor=false&libraries=geometry"></script>
C'est la méthode containsLocation
qui permet de tester si un point au format google.maps.LatLng
est situé à l'intérieur d'un polygone fermé, au format google.maps.Polygon
. Cette function retourne true
si le point est à l'intérieur du polygone ou sur son bord, false
dans le cas contraire.
var insidePoly = google.maps.geometry.poly.containsLocation( oLatLng, oPolygon);
Pour visualiser le résultat, déplacez la souris et/ou cliquez sur la carte.
...sur le click
de la carte
// gestion des evenements mouse sur la carte
google.maps.event.addListener( oCarte, 'click', function( data){
var i, nb, oLatLng, oPoly, sMsg = '';
oLatLng = data.latLng;
// parcours de tous les polygones de la carte
for( i=0, nb = this.oPoly.length; i <nb; i++){
oPoly = this.oPoly[i];
sMsg += '-\u00a0' +(i+1) +'\u00a0';
sMsg += google.maps.geometry.poly.containsLocation( oLatLng, oPoly) ? ' Yes\u00a0IN' : ' Sorry\u00a0OUT';
sMsg += '!\n';
}
alert( sMsg);
});
...sur le mousemove
de la carte
google.maps.event.addListener( oCarte, 'mousemove', function( data){
var i, nb, oLatLng, oPoly;
// affichage position curseur
this.oDivPos.innerHTML = 'lat : ' +data.latLng.toUrlValue().replace(',',', lng : ');
oLatLng = data.latLng;
// affichage in/out
for( i=0, nb=this.oPoly.length; i <nb; i++){
oPoly = this.oPoly[i];
this.oDivIndic[i].className = google.maps.geometry.poly.containsLocation( oLatLng, oPoly) ? 'inside' : 'outside';
}
});