InfoWindow关闭图标未显示在Google地图中

I use this code to create marker and infowindow that shows after clicking on a marker:

我使用此代码创建在单击标记后显示的标记和信息窗口：

// latLng and map are created earlier in code
 var marker = new google.maps.Marker({
        position: latLng,
        map: map
    });

// contentString is just a string with content also created earlier
google.maps.event.addListener(marker, 'click', function(){
        infowindow.setContent(contentString);
        infowindow.open(map, marker);
    });

This code produces everything good except one thing, it doesn't show closing icon in upper right corner of info window.

除了一件事之外，这段代码产生的一切都很好，它不会在信息窗口的右上角显示关闭图标。

Anyone knows what could be the problem?

谁知道可能是什么问题？

I'm using meteor.js if it makes any difference

如果它有任何区别，我正在使用meteor.js

This is how I create the InfoWindow:

这就是我创建InfoWindow的方式：

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

3 个解决方案

#1

Here is the solution for the problem... It seems google maps have some fun way of dealing with images and there was a problem with css as we thought. So the solution is just to add this to your css file:

这是问题的解决方案......似乎谷歌地图有一些处理图像的有趣方式，我们认为css存在问题。所以解决方案就是将它添加到你的css文件中：

img 
{
    max-width: none;
}

That's it, enjoy.

就是这样，享受吧。

#2

I had the same problem. In my case, the infowindow does not show the pointer to the marker. There are some weird looking images in the infowindow as well.

我有同样的问题。在我的情况下，infowindow不显示指向标记的指针。在infowindow中也有一些奇怪的图像。

Apparently this has to do with the stylesheet from bootstrap conflicting with google. The following is a much more specific CSS rather than overriding the general CSS

显然，这与bootstrap与谷歌冲突的样式表有关。以下是一个更具体的CSS，而不是覆盖一般的CSS

/** FIX for Bootstrap and Google Maps Info window styes problem **/
img[src*="gstatic.com/"], img[src*="googleapis.com/"] {
max-width: none;
}

#3

Depending on other css styling you may need to add the !important override...

根据其他CSS样式，您可能需要添加！important覆盖...

img[src*="gstatic.com/"], img[src*="googleapis.com/"] {
max-width: none !important;
}