Question

让我的牙齿陷入谷歌地图API。

我试图在地图上绘制几个标记。完成。然而，我正在为每个标记回收变量/对象。

我最初使用选项创建标记并添加到地图，然后使用相同的标记变量，重新调整它，然后再将其添加到地图中。这确实产生了两个带有单独标题标签的独特标记。

我想为每个标记显示一个信息窗口，但我不确定最佳方法是什么。我还看到一个麻烦标志弹出为每个标记分配点击事件，因为我使用相同的变量来添加每个标记，我不知道如何将其click事件添加到唯一标记（按名称，因为名称是两者都一样，因为它从未收到任何ID？）

var marker_obj = new google.maps.Marker({
    position: myLatlng,
    title:"This is Marker 1",
});

marker_obj.setMap(map);

marker_obj = new google.maps.Marker({
    position: myLatlng,
    title:"This is Marker 2",
});

marker_obj.setMap(map);

为了创建信息窗口，我想到使用一个变量/对象来保存信息窗口，然后在每个标记点击事件中使用新文本重新利用它。

我的问题是：

1：我是否应该为每个标记使用单独的唯一变量/对象（开销？），如果没有，我该如何识别其点击事件。

2：在弹出信息窗口对象之前用新文本重新调整（重新分配）它是否可以，或者我应该为每个标记创建一个唯一的信息窗口吗？

我有点像Java n00b，所以任何帮助都会非常感激。

Answer 1

你说的是正确的。有一个infowindow对象就像你有一个标记对象一样。然后，infowindow的内容会根据您单击的标记而更改。需要注意的一件事（如果你在一个循环中创建标记也会发生这种情况），危险在于所有的infowindows都会得到最后一个的内容。因此，让我们创建一个更新内容的新功能。

另外，您不必在标记对象上调用setMap（）函数，只需在创建标记时指定的选项中指定map属性。

var infowindow = new google.maps.InfoWindow({
    content: ''
});

var marker_obj = new google.maps.Marker({
    position: myLatlng,
    title:"This is Marker 1",
    map: map
});

bindInfoWindow(marker_obj, map, infowindow, 'Marker 1');

marker_obj = new google.maps.Marker({
    position: myLatlng,
    title:"This is Marker 2",
    map: map
});

bindInfoWindow(marker_obj, map, infowindow, 'Marker 2');

然后是一个新功能：

function bindInfoWindow(marker, map, infowindow, html) {
    marker.addListener('click', function() {
        infowindow.setContent(html);
        infowindow.open(map, this);
    });
}

Answer 2

创建全局infowindow对象。 var infowindow = new google.maps.InfoWindow();

并为您的全局标记添加侦听器。

google.maps.event.addListener(marker, "click", function (e) {
            infowindow.setContent("set marker specific content here");
            infowindow .open(map, this);
        });

谷歌地图api多个标记与信息窗口

2 个答案: