0

我正在为音乐场所和活动的数据库实现 Maps 界面，并遇到了一个有趣的问题。我有一系列 HTML 元素，带有对某个 Javascript 函数的 onclick 调用。调用正确运行，并且 javascript 函数第一次正确运行（所有信息都正确传递，我的调试警报正确显示），并且 infoWindow 显示。第二次单击其中一个 div 时，第一个会正确关闭，下面代码中的最终警报会以正确的信息触发，但不会弹出新的 InfoWindow。

地图设置代码：

function mapsInitialize() {
    var mapOptions = {
        center: new google.maps.LatLng(42.4439614, -76.5018807),
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("mapSection"), mapOptions);
    google.maps.event.trigger(map, 'resize');

    for(var x = 0; x < markers.length; x++){
        var tempOptions = {
            position: markers[x].position,
            title: markers[x].name,
            map: map
        }
        markerObjects[markers[x].title] = new google.maps.Marker(tempOptions); 
    }
}

从 div 调用 onclick 的函数：

function generateInfoWindow(despacedName, despacedTitle, eventTitle, url, date, time){
    if(curInfoWindow){
        alert("closing " + curInfoWindow.getContent());
        curInfoWindow.close();
        curInfoWindow = null;
    }
    curInfoWindow = new google.maps.InfoWindow(options = {size: new google.maps.Size(150,50)});
    curInfoWindow.setContent("<a class=\"eventLink\" href=\""+url+"\">"+eventTitle+"</a><br><br>"+markerObjects[despacedName].title+"<br>"+date+" at "+time);
    curInfoWindow.open(map, markerObjects[despacedName]);
    alert(despacedName+" is "+markerObjects[despacedName]);
}

我可以保证markers[] 数组被正确输入。

我试过了，除其他外......

  • 创建一个数组来保存 infoWindows 而不是使用一个 curInfoWindow 变量

  • 数组中没有任何东西会像 generateInfoWindow() 函数的开头那样自动关闭

  • 在 mapsInitialize() 函数中自动创建信息窗口

在搜索解决方案时，Google 上的大多数结果都为我提供了有关地图上事件侦听器的信息 - 这是触发此类事件的唯一方法，还是我正在尝试做的事情有效？

如果需要任何其他代码示例，请告诉我。感谢您的任何建议！

4

1 回答 1

0

根据谷歌地图 API：

InfoWindows 可以附加到标记对象（在这种情况下，它们的位置基于标记的位置）或地图本身的指定 LatLng。如果您希望一次只显示一个信息窗口（就像谷歌地图上的行为一样），您只需要创建一个信息窗口，您可以根据地图事件（例如用户点击）将其重新分配给不同的位置或标记。然而，与 Google Maps API V2 中的行为不同，如果您愿意，地图现在可以显示多个 InfoWindow 对象。

也许这会起作用：

function generateInfoWindow(despacedName, despacedTitle, eventTitle, url, date, time){
    if(!curInfoWindow){
        curInfoWindow = new google.maps.InfoWindow({maxWidth:150});
    }
    curInfoWindow.setContent("<a class=\"eventLink\" href=\""+url+"\">"+eventTitle+"</a><br><br>"+markerObjects[despacedName].title+"<br>"+date+" at "+time);
    curInfoWindow.open(map, markerObjects[despacedName]);
    alert(despacedName+" is "+markerObjects[despacedName]);
}

根据规范，这应该将现有的 curInfoWindow 移动到新标记并更新内容。

注意：此代码无效

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

没有大小属性​​。你能做的最好的就是

new google.maps.InfoWindow({maxWidth:150})

更多关于InfoWindow API

于 2012-11-19T21:27:34.580 回答