Question

如何在Google地图中显示页面加载时的信息窗口。它应该自动显示infowindow弹出窗口。我在谷歌地图中有多个标记。我需要在页面加载时打开所有标记信息窗口。

代码：

    var locations = [
          [
            "Market 1",
            22.809999,
            86.179999,
            5,
            "Market1",
            "Market1",
            "Market1",
            "found"
        ],
     [
            "Market 2",
            22.801111,
            86.171111,
            5,
            "Market2",
            "Market2",
            "Market2",
            "found"
        ]
    ]

    var map = new google.maps.Map(document.getElementById('map'), {
        zoom: 14,
        center: new google.maps.LatLng(22.803444, 86.179525),
        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]),
            map: map
        });

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

Answer 1

您可以通过为每个标记分别启动InfoWindow来一次打开多个标记。我建议删除原始的var infowindow并在每个标记的for循环中执行以下操作：

<html>
<head>
<link rel="stylesheet" type="text/css" href="css/stylesheet.css">
    <title></title>
</head>
<body>
<div class="wrapper">
<div class="header">
<!--Header, the first 250px from the top-->
    <div class=bodytop>
    <!--upper part of the website-->
        <center>
        <div class="buttonbox">
        Dit is button3
        </div>
        <div class="buttonbox">
        Dit is button2
        </div>
        <div class="buttonbox">
        Dit is button1
        </div>
        </center>
    <div class=bodybottom>
    <!--Lower part of the website-->
    </div>
    </div>
</div>
</div>
</body>
</html>

https://jsfiddle.net/vq7zfbgj/16/

Answer 2

我将您的小提琴修改为this，并且infoWindow将在页面加载时打开。我添加另一个标记只是为了解决更多的标记。希望它有所帮助。

for (i = 0; i < locations.length; i++) {
  var infowindow = new google.maps.InfoWindow;

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

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

  infowindow.setContent(locations[i][0], locations[i][6]);
  infowindow.open(map, marker);
}

如何在没有点击事件的情况下在谷歌地图中显示信息窗口

2 个答案: