点击谷歌地图多边形内

问题描述：

包含的JavaScript代码段应该做到以下几点：点击谷歌地图多边形内

在地图上的用户点击，初始化headMarker和周围画
作为圈内用户点击，初始化tailMarker并画出这两个标记作为预期

1正在发生之间的路径。但是当用户点击圈内时，在function(overlay,point),overlay中非空，而point为空。因此，代码无法初始化tailMarker。

有人可以告诉我一个出路。

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}); 
    } 
});

答

所有你需要做的是设置在GPolygon构造的圆的clickable: false选项。下面是我用来回答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>

上面的例子中的截图：

Google Maps Clicking Inside a Polygon

我用钻石，不是圆的，因为它们更容易在V2画API。请注意，如果未使用clickable: false选项创建多边形，则click侦听器的参数latlng应为空。

非常感谢。有用。它奇怪，你必须设置clickable：“false”为启用点击（我以为它会是可点击的：true） – user315067 2010-05-22 01:18:39

@ amarsh-anand：是的，基本上通过设置它'可点击：假'你告诉API发生在多边形上的点击应该作为点击来处理，而不是点击多边形。 – 2010-05-22 01:35:41

点击谷歌地图多边形内

相关推荐