Google Maps API InfoWindow 不显示内容答案

【问题标题】：Google Maps API InfoWindow not Displaying contentGoogle Maps API InfoWindow 不显示内容
【发布时间】：2011-05-16 10:56:53
【问题描述】：

我的代码如下所示：

var map = /*some google map - defined earlier in the code*/;
var geocoder = new google.maps.Geocoder();
var address = 'Some Address, Some Street, Some Place';
geocoder.geocode({'address':address},function(results,status){
    if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        var infobox = new google.maps.InfoWindow({
            content: 'Hello world'
        });
        for(i in results){
            var marker = new google.maps.Marker({
                map: map, 
                position: results[i].geometry.location
            });
            google.maps.event.addListener(marker, 'click', function() {
                infobox.setContent('blablabla');
                infobox.open(map,marker);
                alert(infobox.content); //displays 'blablabla'
            });
        }
    }
});

基本上它是根据给定的地址字符串在单个地图上创建一些标记。它将一个 infoWindow 添加到单击时打开的标记。

问题是：infoWindow 显示为空。

此处截图：

PS：使用 Maps API V3

【问题讨论】：

您解决了这个问题吗？我面临同样的问题

标签： google-maps google-maps-api-3 infowindow geocode

【解决方案1】：

我刚刚遇到了同样的问题，并找到了非常简单的原因：信息窗口中的文本实际上是显示的，但是是白色的，因此在白色背景上不可见。通过 CSS 为内容赋予不同的颜色解决了我的问题。

【讨论】：

听起来不可思议，但我也遇到了同样的问题，而且.. 是的，它是白色信息窗口上的白色文本！！
wtf 是的，我生命中的那 2 个小时永远不会回来。好电话。
经过 4 小时的痛苦和折磨后，这个技巧解决了我的问题。好球，救了我的命

【解决方案2】：

基本上，您需要使用标记添加循环外部的函数将信息框消息添加到每个标记...有关示例和详细说明，请参见： http://code.google.com/apis/maps/documentation/javascript/events.html#EventClosures

【讨论】：

【解决方案3】：

这是我的做法。

var map,markersArray,infowindow; //infowindow has been declared as a global variable.

function initialize(){
    var myOptions = {
    zoom: 14,
    center: new google.maps.LatLng(51.5001524,-0.1262362),
    mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"),
                                myOptions);

    infowindow = new google.maps.InfoWindow(
                    { 
                        size: new google.maps.Size(150,50)
                    });

    google.maps.event.addListener(map, 'click', function() {
        infowindow.close();
        });

    markersArray = [];
}

function createMarker(latlng, html,zoom) {
   var contentString = html;
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        zIndex: Math.round(latlng.lat()*-100000)<<5
    });

    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(contentString); 
        infowindow.open(map,marker);
    });
    marker.MyZoom = zoom; 
    return marker; 
}

您可以找到工作示例 here 和完整的 javascript here。

【讨论】：

非常感谢，我一直在运行测试，但我的问题似乎出在其他地方，因为我已经将您的代码以及 API 文档上的代码复制到我的程序中并运行它，并且我仍然得到空的 InfoWindows。如果我找到了，我会在这里发布一个解决方案。
能否确认浏览器和平台？你能看到我的信息窗口吗？只需尝试将我的 HTML 文件和 javascript 按原样复制到您的服务器上，如果您还没有，看看它是否有效。您还确保您的信息框变量在函数外部而不是内部声明（请参见代码的第 7 行，删除 var）

【解决方案4】：

我已通过添加以下代码解决了问题。

setTimeout(function () { GeocodeMarker.info.open(GoogleMap, 地理编码标记）； }, 300);

谢谢

【讨论】：