Google Maps API：infoWindow由于鼠标事件而自动闪烁/关闭 [英] Google Maps API: infoWindow flickers/closes automatically because of mouseout event

问题描述

我正在为我正在开发的一个漂亮的新项目创建多边形。无论何时将鼠标悬停在infoWindow上，多边形上的mouseout事件触发时都会出现问题。除非鼠标移动到多边形和infoWindow之外，否则我不希望鼠标事件触发。有任何想法吗？这里是大部分相关的代码。

  infoWindow = new google.maps.InfoWindow（{
 content：myContent 
}）; 
 
 var polygon = new google.maps.Polygon（{
 paths：polygonPath，
 strokeColor：data.color，
 strokeOpacity：0.5，
 strokeWeight ：0，
 fillColor：data.color，
 fillOpacity：0.5，
 id：polygonId，
名称：data.name，
 shortDesc：data.short_desc，
 map：map 
}）; 
 
 
 google.maps.event.addListener（多边形，'click'，函数（e）{
 infoWindow.open（map）; 
 infoWindow.setPosition（ e.latLng）; 
}）; 
 
 google.maps.event.addListener（polygon，'mouseout'，function（）{
 infoWindow.close（）; 
}）; 
  

解决方案

code>的多边形观察 mousemove 为地图（当鼠标移过多边形或infowindow时，这不会触发）

  google.maps.event.addListener（多边形，'click'，函数（e）{
 infoWindow.open（map）; 
 infoWindow.setPosition（e.latLng）; 
 google.maps.event.addListenerOnce（map，'mousemove'，function（）{
 infoWindow.close（）; 
}）; 
}）; 
  

I'm in the midst of creating polygons on a spiffy new project I am working on. The problem arises whenever you hover over the infoWindow, the mouseout event on the polygon fires. I don't want the mouseout event to fire unless the mouse moves outside of the polygon AND the infoWindow. Any ideas? Here's most of the relevant code.

    infoWindow = new google.maps.InfoWindow({
          content: myContent
    });

    var polygon = new google.maps.Polygon({
          paths: polygonPath,
          strokeColor: data.color,
          strokeOpacity: 0.5,
          strokeWeight: 0,
          fillColor: data.color,
          fillOpacity: 0.5,
          id:polygonId,
          name: data.name,
          shortDesc: data.short_desc,
          map: map 
    }); 


    google.maps.event.addListener(polygon, 'click', function(e){
          infoWindow.open(map);
          infoWindow.setPosition(e.latLng);
    });

    google.maps.event.addListener(polygon, 'mouseout', function(){
          infoWindow.close();
    });

解决方案

Instead of mouseout of the polygon observe mousemove for the map(this will not fire when the mouse moves over the polygon or the infowindow)

google.maps.event.addListener(polygon, 'click', function(e){
      infoWindow.open(map);
      infoWindow.setPosition(e.latLng);
      google.maps.event.addListenerOnce(map, 'mousemove', function(){
        infoWindow.close();
      });
});

这篇关于Google Maps API：infoWindow由于鼠标事件而自动闪烁/关闭的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！