MouseOver另一个Marker时如何关闭InfoWindow? Google Map API

时间:2017-07-25 09:38:40

标签: javascript google-maps google-maps-api-3

当我在地图上点击标记时出现问题,InfoWindow打开但是当我将鼠标悬停在另一个标记上时,单击InfoWindow它已关闭。 现在,当我将鼠标悬停在另一个位置时,我必须让InfoWindow不关闭,只有当我点击Marker才能关闭旧的InfoWindow以打开新的InfoWindow?

喜欢这个http://aqicn.org/here/

我的Javascript

markers.forEach(function(diadiem) {
                  var marker = new google.maps.Marker({
                    position: diadiem.position,
                    icon: icons[diadiem.type].icon,
                    map: map
                  });

                  // Click marker
                  google.maps.event.addListener(marker, 'click', (function(marker) {
                        return function() {
                          infowindow.setContent('Ok click');             
                          infowindow.open(map, marker);
                        }
                      })(marker));

                  // Hover mouse
                  google.maps.event.addListener(marker, 'mouseover', (function(marker) {
                        return function() {
                          infowindow.setContent('OK hover');
                          infowindow.open(map, marker);
                        }
                      })(marker));
});

2 个答案:

答案 0 :(得分:0)

现在你只有一个infoWindow,它会被重新定位并在每个悬停时获得一个新内容 您也可以每次创建一个新的信息窗口。 像这样。

注意,这将生成双打

// Hover mouse
google.maps.event.addListener(marker, 'mouseover', (function(marker) {
  return function() {
    var infowindow = new google.maps.InfoWindow();
    infowindow.setContent('OK hover');
    infowindow.open(map, marker);
  }
})(marker));

答案 1 :(得分:0)

我成功地解决了我的问题!

创建2个不同的InfoWindow

var infowindow = new google.maps.InfoWindow();
var infowindow2 = new google.maps.InfoWindow();

markers.forEach(function(diadiem) {
                  var marker = new google.maps.Marker({
                    position: diadiem.position,
                    icon: icons[diadiem.type].icon,
                    map: map
                  });

                  // Click marker
                  google.maps.event.addListener(marker, 'click', (function(marker) {
                        return function() {
                          infowindow.setContent('Ok click');             
                          infowindow.open(map, marker);
                          infowindow2.close(map, marker);
                        }
                      })(marker));

                  // Hover mouse
                  google.maps.event.addListener(marker, 'mouseover', (function(marker) {
                        return function() {
                          infowindow2.setContent('OK hover');
                          infowindow2.open(map, marker);
                        }
                      })(marker));
});