使用信息窗口打开/关闭问题

Question

今天我看到一个关于在同一个按钮中打开/关闭的答案，我决定尝试使用。

我想要的是点击标记，然后一个信息窗口出现在我的地图中，但它不起作用。

JSFiddle simple marker with infowindow

JSFiddle toogle on/off but no infowindow

当我尝试像这样加入（使用 infowindow 工具）时：

google.maps.event.addDomListener(buttonCarrosUI, 'click', function() {
  if(marker && marker.setMap){
      if (marker.getMap() != null)
          marker.setMap(null);
     else marker.setMap(map_canvas);
  }else{
      var myLatLng;
      var title = marker.title;
      $.each( data.markers, function(i, marker) {
          myLatLng = new google.maps.LatLng(marker.latitude, marker.longitude);
      });
      var infowindow = new google.maps.InfoWindow({
          content: title,
      });
          marker = new google.maps.Marker({
              position: myLatLng,
              map: map_canvas,  
              icon: image,
              title: title
          });
          google.maps.event.addListener(marker, 'click', function() {
              infowindow.open(map_canvas,marker);
          });
   }
});

我遇到了这个问题

TypeError：标记未定义

var title = marker.title;

如果有人可以帮助我，我将非常感激，谢谢。

Answer 1

您正在 $.each 之外创建标记。除非您希望一次打开多个信息窗口，否则最好创建一个全局信息窗口并重复使用它。此外，您正在覆盖 $.each 中的“标记”变量。请注意，这不适用于多个标记。如果您有多个标记，则需要保留对数组中标记的引用（此代码来自的原始示例切换了一条折线）。下面的代码对我有用：

google.maps.event.addDomListener(buttonCarrosUI, 'click', function () {
    var data = JSON;
    var myLatLng;
    if (marker && marker.setMap) {
        if (marker.getMap() != null) marker.setMap(null);
        else marker.setMap(map_canvas);
    } else {
        $.each(data.markers, function (i, markerInfo) {
            myLatLng = new google.maps.LatLng(markerInfo.latitude, markerInfo.longitude);
            marker = new google.maps.Marker({
                position: myLatLng,
                map: map_canvas,
                title: markerInfo.title
            });
            google.maps.event.addListener(marker, 'click', function () {
                infowindow.setContent(marker.getTitle());
                infowindow.open(map_canvas, marker);
            });
        });

    }
});

working fiddle