How do I detect a click event on a google map through an overlay?

前端未结

关注

 1  735

My problem is that I have a circle map overlay but I want to be able to move the circle by clicking the map to set the new center, the actual problem is that when I click on

相关标签:

1条回答

借酒劲吻你

2020-12-06 18:44

All you need to do is to set the clickable: false option in the GPolygon constructor, as in the following example (GPolygonOptions: API Reference):

<!DOCTYPE html>
<html> 
<head> 
   <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
   <title>Google Maps Non Clickable Polygon Demo</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>

Screenshot with evidence:

Google Maps Non Clickable Polygon Demo

Note that the click(overlay: GOverlay, latlng: GLatLng, overlaylatlng: GLatLng) event passes different arguments based on the context of the click, and whether or not the click occured on a clickable overlay. If the click does not occur on a clickable overlay, the overlay argument is null and the latlng argument contains the geographical coordinates of the point that was clicked. If the user clicks on an overlay that is clickable, the overlay argument contains the overlay object, while the overlaylatlng argument contains the coordinates of the clicked overlay (Source: API Reference).

0 讨论(0)