谷歌地图及其标记

我有一个标记位置的JSON数组被拉入谷歌地图 – 这很好。

我也有infoWindows链接到每个标记 – 这些也工作正常。

但是,当我单击标记(在任何浏览器中)时,infoWindow仅显示在最后添加的标记上。

这是一个小提琴: http : //jsfiddle.net/neuroflux/8WDwn/10/这里是我的循环:

for (var a = 0; a < dealer_markers.length; a++) { var tmpLat = dealer_markers[a].lat; var tmpLng = dealer_markers[a].lng; var tmpName = dealer_markers[a].name; var tmpAdr = dealer_markers[a].adr; var tmpTel = dealer_markers[a].pc; var tmpPc = dealer_markers[a].tel; contentString[a] = '

'+tmpName+'

'+tmpAdr+'

'+tmpPc+'

'+tmpTel+'

'; var content = contentString[a]; dealer[a] = new google.maps.LatLng(tmpLat,tmpLng); deal = dealer[a]; marker[a] = new google.maps.Marker({ map:map, position: deal, icon:'dealer.png', title: "|"+new google.maps.LatLng(dealer[a].Ja,dealer[a].Ka) }); lat = marker[a].position.Ja; lng = marker[a].position.Ka; compositeLatLng = new google.maps.LatLng(lat,lng); mark = marker[a]; google.maps.event.addListener(mark, 'click', function(a) { if (mark.infowindow) { mark.infowindow.close(); } mark.infowindow = new google.maps.InfoWindow({ content: contentString[marker.indexOf(this)] }); mark.infowindow.open(map,mark); }); }

正如我在评论中所说,您可以使用闭包来解决问题。 这是演示 。 我创建了一个包装函数:

  1. 创建一个标记
  2. 可选地附加一个onclick处理程序

在该处理程序内:

  1. 它将一个空白的infoWindow附加到地图上(如果需要)
  2. 它会隐藏该窗口,更改其内容并在标记上再次显示(从此处借来的逻辑)

 function _newGoogleMapsMarker(param) { var r = new google.maps.Marker({ map: param._map, position: new google.maps.LatLng(param._lat, param._lng), title: param._head }); if (param._data) { google.maps.event.addListener(r, 'click', function() { // this -> the marker on which the onclick event is being attached if (!this.getMap()._infoWindow) { this.getMap()._infoWindow = new google.maps.InfoWindow(); } this.getMap()._infoWindow.close(); this.getMap()._infoWindow.setContent(param._data); this.getMap()._infoWindow.open(this.getMap(), this); }); } return r; } for (var a = 0; a < dealer_markers.length; a++) { . . . var marker = _newGoogleMapsMarker({ _map: map, _lat: tmpLat, _lng: tmpLng, _head: '|' + new google.maps.LatLng(tmpLat, tmpLng), _data: '...' }); } 

问题是你在循环中创建一个函数,然后在该函数中使用标记 ,因此它总是出现在最后一个标记的旁边,因为在每次循环迭代时都会重新分配标记

最好不要在循环中创建函数,所以我会像这样重写:

 var map = null // your map created here var infowindow = null; var itemClick = function(a) { if (this.infowindow) { this.infowindow.close(); } this.infowindow = new google.maps.InfoWindow({ content: contentString[marker.indexOf(this)] }); this.infowindow.open(this.map, a); } for (var a = 0; a < dealer_markers.length; a++) { /// Other code..... google.maps.event.addListener(mark, 'click', itemClick); }