google-maps - Google map addListener 如何为我们提供全局点击事件？

Question

我是初学者，很抱歉我的英语不好。

Summery:我有两个事件: google.maps.event.addListener(map, 'click', function(e) 和 google.maps.event.addListener(mpolygon, 'click', function(e) 但我希望他们两个在一起。像这样的东西: google.maps.event.addListener(map, mpolygon 'click', function(e)

说明: 我开发了一个非常简单的程序来更好地理解 Google map 。

此代码使用几何库。我们在 map 上有一个多边形。当我们单击 map 时，程序会在 map 上创建一个绿色圆圈标记。但是当我们单击多边形时，它应该在多边形上创建一个红色圆圈标记。我的问题是，当我单击 map 时，它会在 map 上创建一个绿色圆圈，因为我们有“google.maps.event.addListener(map, 'click', function(e)” 但是为了在多边形上创建红色标记，我们必须将“google.maps.event.addListener(map, 'click', function(e)”更改为“google.maps.event.addListener(bermudaTriangle, 'click', function(e)” 我两个都想要。我的意思是，当我单击 map 或百慕大三角时，它们都会起作用。

我需要这样的东西: “google.maps.event.addListener( map ，百慕大三角，'点击'，函数(e)”

这是我的源代码，只有一个 event.addListener，我们只需单击 map 即可创建绿色标记，但我希望它有两个用于 map 和多边形的 event.addListener:

google.maps.event.addListener(map, 'click', function(e) {
var result;

if (google.maps.geometry.poly.containsLocation(e.latLng, bermudaTriangle)) {
  result = 'red';
}
else
{
  result = 'green';
}

var circle = {
  path: google.maps.SymbolPath.CIRCLE,
  fillColor: result,
  fillOpacity: .9,
  strokeColor: 'white',
  strokeWeight: .9,
  scale: 10
};

new google.maps.Marker({
  position: e.latLng,
  map: map,
  icon: circle
})

 });

Answer 1

你有两个选择:

1. 将 bermudaTriangle 的 clickable 选项设置为 false 。 点击 - 多边形上的事件将不再被捕获，并且您当前的脚本将按预期工作。

2. 仅使用map的监听器，并在点击bermudaTriangle时触发 map 上的点击:

    google.maps.event.addListener(map, 'click', function(e,color) {
   
     color=color||'green'
   
     var circle = {
       path: google.maps.SymbolPath.CIRCLE,
       fillColor: color,
       fillOpacity: .9,
       strokeColor: 'white',
       strokeWeight: .9,
       scale: 10
     };
   
     new google.maps.Marker({
       position: e.latLng,
       map: map,
       icon: circle
     })
   

   });

   google.maps.event.addListener(bermudaTriangle, 'click', function(e) {
    google.maps.event.trigger(map,'click',e,'red')
   });
   

如您所见， map 点击的监听器现在有第二个参数 color 。
当您单击 map 时，此参数为未定义(默认为绿色)。当您单击 bermudaTriangle 时，参数为 red 。

当您需要将其应用于多个多边形时，第二种解决方案应该是更好的选择，因为您不需要检查 latLng 是否与任何多边形相交。