cliquer à l'intérieur d'un polygone dans Google Maps

L'extrait de code JavaScript inclus est censé faire ce qui suit:cliquer à l'intérieur d'un polygone dans Google Maps

Comme l'utilisateur clique sur la carte, initialiser headMarker et dessinez un cercle (polygone) autour
comme l'utilisateur clique à l'intérieur du cercle, initialiser tailMarker et tracer le chemin entre ces deux marqueurs

1 se passe comme prévu. Mais lorsque l'utilisateur clique dans le cercle, dans function(overlay,point), overlay est non nul alors que point est null. Pour cette raison, le code ne parvient pas à initialiser tailMarker.

Quelqu'un peut-il me dire un moyen de sortir.

GEvent.addListener(map, "click", function(overlay,point) { 
    if (isCreateHeadPoint) { 
     // add the head marker 
     headMarker = new GMarker(point,{icon:redIcon,title:'0'}); 
     map.addOverlay(headMarker); 
     isCreateHeadPoint = false; 
     // draw the circle 
     drawMapCircle(point.lat(),point.lng(),1,'#cc0000',2,0.8,'#0',0.1); 
    } else { 
     // add the tail marker 
     tailMarker = new GMarker(point,{icon:greenIcon,title:''}); 
     map.addOverlay(tailMarker); 
     isCreateHeadPoint = true; 
     // load thes path from head to tail 
     direction.load("from:" + headMarker.getPoint().lat()+ ", " + 
         headMarker.getPoint().lng()+ " " + 
         "to:" + tailMarker.getPoint().lat() + "," + 
         tailMarker.getPoint().lng(), 
         {getPolyline:true}); 
    } 
});

Source

2010-05-19 user315067

Tout ce que vous devez faire est de définir l'option clickable: false dans le constructeur GPolygon de votre cercle. Voici un exemple que je répondais another similar question on Stack Overflow:

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps Clicking Inside a Polygon</title> 
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false" 
       type="text/javascript"></script> 
</head> 
<body onunload="GUnload()"> 
    <div id="map" style="width: 450px; height: 300px"></div> 

    <script type="text/javascript"> 
     var map = new GMap2(document.getElementById("map")); 
     map.setCenter(new GLatLng(37.4419, -122.1419), 13); 

     GEvent.addListener(map, "click", function(overlay, latlng) { 
     var lat = latlng.lat(); 
     var lon = latlng.lng(); 
     var latOffset = 0.01; 
     var lonOffset = 0.01; 
     var polygon = new GPolygon([ 
      new GLatLng(lat, lon - lonOffset), 
      new GLatLng(lat + latOffset, lon), 
      new GLatLng(lat, lon + lonOffset), 
      new GLatLng(lat - latOffset, lon), 
      new GLatLng(lat, lon - lonOffset) 
     ], "#f33f00", 5, 1, "#ff0000", 0.2, { clickable: false }); 

     map.addOverlay(polygon); 
     }); 
    </script> 
</body> 
</html>

Capture d'écran de l'exemple ci-dessus:

Google Maps Clicking Inside a Polygon

je diamants au lieu de cercles, parce qu'ils sont plus faciles à dessiner dans la v2 API Notez que le paramètre latlng de l'écouteur click aurait été nul si les polygones n'étaient pas créés avec l'option clickable: false.

Source

2010-05-19 19:27:23

Un grand merci. Ça marche. C'est bizarre comment vous devez mettre cliquable: "faux" pour activer le clic (je pensais que ce sera cliquable: vrai) – user315067

@ amarsh-anand: Oui, fondamentalement en le définissant 'clickable: false' vous dites à l'API qu'un clic qui se trouve sur un polygone doit être traité comme un clic sur la carte, au lieu d'un clic sur le polygone. –

cliquer à l'intérieur d'un polygone dans Google Maps

Répondre

Questions connexes