javascript - 获取带有 Google map 的新方形 InfoWindows？

Question

我正在构建一个主要功能是 map 搜索并显示英国各地发生的职业摔跤赛事的网站。我正在使用 Google Maps JavaScript API v3 来实现这一点，但我有一个问题，为什么我的应用程序的 InfoWindows 看起来与 maps.google.co.uk 上的 InfoWindows 不同？ .

比较以下两个屏幕截图。我的:

以及 Google map 网站:

为什么 Google map 网站的 InfoWindows 是方形的，为什么我使用最新版 Google Maps JavaScript API 的应用程序的 InfoWindows 是圆形的？

Answer 1

马丁，

我去看了 Google Maps API 演示并找到了这个演示:

http://gmaps-samples-v3.googlecode.com/svn/trunk/geocoder/v3-geocoder-tool.html#q%3D42.032974%2C-90.703125

您应该会看到方形的信息窗口。

我查看了底层代码，发现了下面的代码，可能是您窗口的边界覆盖。希望对您有所帮助。

var openInfoWindow = function(resultNum, result, marker) {
    return function() {
      if (selected != null) {
        document.getElementById('p' + selected).style.backgroundColor = "white";
        clearBoundsOverlays();
      }

      map.fitBounds(result.geometry.viewport);
      infowindow.setContent(getAddressComponentsHtml(result.address_components));
      infowindow.open(map, marker);

      if (result.geometry.bounds) {
        boundsOverlay = new google.maps.Rectangle({
          'bounds': result.geometry.bounds,
          'strokeColor': '#ff0000',
          'strokeOpacity': 1.0,
          'strokeWeight': 2.0,
          'fillOpacity': 0.0
        });
        boundsOverlay.setMap(map);
        google.maps.event.addListener(boundsOverlay, 'click', onClickCallback);
        document.getElementById('boundsLegend').style.display = 'block';
      } else {
        boundsOverlay = null;
      }

      viewportOverlay = new google.maps.Rectangle({
          'bounds': result.geometry.viewport,
          'strokeColor': '#0000ff',
          'strokeOpacity': 1.0,
          'strokeWeight': 2.0,
          'fillOpacity': 0.0
        });
      viewportOverlay.setMap(map);
      google.maps.event.addListener(viewportOverlay, 'click', onClickCallback);
      document.getElementById('viewportLegend').style.display = 'block';

      document.getElementById('p' + resultNum).style.backgroundColor = "#eeeeff";
      document.getElementById('matches').scrollTop =
        document.getElementById('p' + resultNum).offsetTop -
        document.getElementById('matches').offsetTop;
      selected = resultNum;
    }
  }