将 pointerenter 和 pointerleave 事件监听器添加到映射/容器？

Question

我在一个组里有很多形状，需要监听它们的pointerenter和pointerleave事件。目前我正在将事件监听器添加到每个形状，但据我了解，最好让一个监听器覆盖所有形状。

按照此处的示例为 tap 添加事件侦听器：https://developer.here.com/api-explorer/maps-js/v3.0/events/map-objects-event-delegation，我想做同样的事情，但对于 pointerenter 和 pointerleave，但不管我怎么试都不能让他们中的任何一个开火。

我试过将它添加到 container，如上例所示：

container.addEventListener('pointerenter', function(event){
   console.log(event.target);
});

还有 map:

map.addEventListener('pointerenter', function(event){
   console.log(event.target);
});

tap 事件完美触发，但对于 pointerenter 和 pointerleave，我目前被迫将两个听众添加到每个单独的形状。

Answer 1

对于您当前的代码段，只有在鼠标进入顶级对象、地图或容器时才会触发 pointerenter 事件。

但是，如果您使用 addEventListener 函数的第三个可选参数，并将其设置为 true，则表明处理程序应在捕获阶段，相对于冒泡阶段：

map.addEventListener('pointerenter', function (event) {
  console.log(event.target instanceof H.geo.Polygon);
}, true);

Add pointerenter and pointerleave event listeners to map / container?