【问题标题】:Auto Open Infowindow自动打开信息窗口
【发布时间】:2015-12-23 02:17:14
【问题描述】:

我正在为 2 个分支加载多个标记。我无法在页面加载时自动打开信息窗口?

    var locations = [
  ['<strong>Info</strong><br /> Address', 40.004257, -105.253425, 2],
  ['<strong>Info</strong><br /> Address', 39.999326, -105.257662, 1]
];

var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 14,
  center: new google.maps.LatLng(40.00, -105.24),
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

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

var marker, i;

for (i = 0; i < locations.length; i++) { 
  marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),
    icon: "images/favicon.png",
    map: map
  });

  google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.setContent(locations[i][0]);
      infowindow.open(map, marker);
    }
  })(marker, i));
    }

代码有什么问题吗?是否有解决自动打开信息窗口的问题?

【问题讨论】:

  • 它应该在哪个标记上打开?您为每个将在单击时打开信息窗口的标记添加一个侦听器。无论如何,您有多个标记和一个 InfoWindow 对象。不能在多个标记上打开同一个对象。

标签: javascript jquery google-maps google-maps-api-3 jquery-gmap3


【解决方案1】:

这是我在加载页面时加载 infoWindows 所做的。

function initMap() {
var locations = [
  ['<strong>Info</strong><br> Address', 40.004257, -105.253425, 2],
  ['<strong>Info</strong><br> Address', 39.999326, -105.257662, 1]
];

var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 14,
  center: new google.maps.LatLng(40.00, -105.24),
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var marker, i;

for (i = 0; i < locations.length; i++) { 
  marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),
    map: map
  });

  var infowindow = new google.maps.InfoWindow({
    content:locations[i][0]
  });
  infowindow.open(map, marker);
}
}

【讨论】:

    【解决方案2】:

    尝试添加

     infowindow.open(map,marker);
    

    在 for 循环之后。

    也许这个可以帮助。

    Google maps open info window by default?

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2015-11-07
      • 1970-01-01
      • 1970-01-01
      • 2019-10-30
      • 1970-01-01
      • 2015-04-11
      • 1970-01-01
      相关资源
      最近更新 更多