Question

我正在制作一个不同标记的地图，这些标记应该有不同的信息窗口。但是当我试图将信息放在多个标记上时，信息窗的位置停留在第一个点击标记处。我做错了什么？

<script type="text/javascript">
      function initialize() {
        var latlng = new google.maps.LatLng(53.033117,5.639752);

        var latingSiton = new google.maps.LatLng(53.0356197730161,5.62613738302669);
        var SitonImg = 'images/siton.png';
        var latingZee = new google.maps.LatLng(53.0360534900284,5.62488617774811);
        var ZeeImg = 'images/zee.png';
        var latingHylkema = new google.maps.LatLng(53.0373853769166,5.62924255777811);
        var HylkemaImg = 'images/hylkema.png';
        var latingDijkstra = new google.maps.LatLng(53.0360125088934,5.62735529113307);
        var DijkstraImg = 'images/dijkstra.png';

        var myOptions = {
          zoom: 16,
          center: latlng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        var contentString = 'test';

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

          var marker = new google.maps.Marker({
              position: latingSiton, 
              map: map, 
              icon: SitonImg,
            });

          google.maps.event.addListener(marker, 'click', function() {
              infowindow.open(map,marker);
            });

          var marker = new google.maps.Marker({
              position: latingZee, 
              map: map, 
              icon: ZeeImg,
          });

          google.maps.event.addListener(marker, 'click', function() {
              infowindow.open(map,marker);
            });

          var marker = new google.maps.Marker({
              position: latingHylkema, 
              map: map, 
              icon: HylkemaImg,
          });

          google.maps.event.addListener(marker, 'click', function() {
              infowindow.open(map,marker);
            });

          var marker = new google.maps.Marker({
              position: latingDijkstra, 
              map: map, 
              icon: DijkstraImg,
          });

          google.maps.event.addListener(marker, 'click', function() {
              infowindow.open(map,marker);
            });
        }
    </script>

向前谢谢！

Answer 1

或者，不要使用Pratik的建议，试试这个：

var marker = new google.maps.Marker({
     position: latingSiton, 
     map: map, 
     icon: SitonImg
});

// repeat this line after each new Marker is created:
bindInfoWindow(marker, map, infowindow);

然后创建一个新函数：

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

谷歌地图api v3：infowindow位置

1 个答案: