Question

我在Google地图上显示多个标记时出现问题。我一直在尝试来自互联网的东西，但大部分时间地图都破了。

编辑：我设法得到了多个标记。我现在只需要为每个添加信息窗口。

我的更新代码如下：

<script type="text/javascript">
function initialize() {
latLngs = [ 
    new google.maps.LatLng(44.3118328, -79.5549532),
    new google.maps.LatLng(44.3118325, -80.5549533),
    new google.maps.LatLng(44.3118326, -81.5549534),
    new google.maps.LatLng(44.3118327, -82.5549535)
    ];

var latlng = new google.maps.LatLng(44.3118328, -79.5549532);
var myOptions = {
  zoom: 15,
  center: latlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
};


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


var contentString = '<div id="mapinfowindow">'+'1970 Thompson St <br> Innisfil' + '<br>' + '$329,900'
+'<a href="http://www.something.com/Featured_Listings_files/1970%20Thompson%20-%20Brochure.pdf"><br><br>View Brochure</a></div>';

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

      var image = new google.maps.MarkerImage(
'images/marker.png',
new google.maps.Size(50,50),
new google.maps.Point(0,0),
new google.maps.Point(25,50)
);

var shadow = new google.maps.MarkerImage(
'images/markershadow.png',
new google.maps.Size(78,50),
new google.maps.Point(0,0),
new google.maps.Point(25,50)
);

var shape = {
coord: [28,3,32,4,35,5,37,6,38,7,39,8,40,9,42,10,42,11,43,12,44,13,44,14,44,15,45,16,45,17,45,18,45,19,45,20,45,21,45,22,45,23,44,24,44,25,44,26,43,27,43,28,42,29,41,30,41,31,40,32,39,33,39,34,38,35,37,36,36,37,35,38,34,39,33,40,32,41,31,42,30,43,29,44,28,45,26,46,24,47,24,47,22,46,21,45,19,44,18,43,17,42,16,41,15,40,14,39,13,38,12,37,12,36,11,35,10,34,9,33,9,32,8,31,7,30,7,29,6,28,5,27,5,26,4,25,4,24,4,23,4,22,3,21,3,20,3,19,3,18,4,17,4,16,4,15,4,14,5,13,6,12,6,11,7,10,8,9,9,8,10,7,12,6,14,5,16,4,20,3,28,3],
type: 'poly'
};


var markers = new Array(latLngs.length);

for (var i = 0; i < markers.length; i++) {
 markers[i] = new google.maps.Marker({
    position: latLngs[i],
    title:"Marker "+i,
    icon: image,
    shadow: shadow,
    map: map,
    shape: shape
});
markers[i].setMap(map);     
}

for (var i2 = 0; i2 < markers.length; i2++) {
    google.maps.event.addListener(markers[i2], 'click', function() {
    infowindow.open(map,markers[i2]);
    });
}

}

我现在需要将信息窗口添加到每个标记中，每个标记都有其窗口内的唯一内容。

感谢您的时间。

Answer 1

假设您有一个LatLng对象数组调用latLngs，并且您希望每个对象都有一个标记。您可能会这样做（在您的问题中使用代码的尾部并修改它）：

var markers = new Array(latLngs.length);
for (var i = 0; i < markers.length; i++) {
    markers[i] = new google.maps.Marker({
        position: latLngs[i],
        title:"Marker "+i,
        icon: image,
        shadow: shadow,
        map: map,
        shape: shape
    });
    markers[i].setMap(map);
}

主要的是您无法重复使用marker变量。您需要为每个标记使用不同的变量，因此需要使用数组。

Answer 2

看起来OP能够使用Trott的解决方案，但我无法让它自己工作。我找到了其他更简单的东西，对我有用right here。总而言之，将addlistener调用包装在您自己的函数中，然后从循环中调用该函数（无论您在循环数据还是标记的任何地方）。我的功能很简单......

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

带有自定义图标的Google Maps API V3的多个标记

2 个答案: