谷歌地图API infowindow只显示阵列的最后一条语句

Question

我有这段代码。添加标记的工作很好，但对标记没有正确的infowindow ..（标记也是）

它只返回数组infoUser中所有标记的最后一条语句。

我知道..我复制了一个问题，但我试图用很多回答的问题修复它，但它不起作用。

function initMap() { 
     var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 3, 
      center: {lat: 49.7437895, lng: 15.3360726} 
     }); 
//array 
     var infoUser = [ 
      ['Germany','Maj','TUC','20','300'], 
      ['Czech Republic','admin','Bla','50','400'], 
      ['Italy','HOOOO','BUC','1','50'], 
      ['Italy','aaaaa','aaa','10','20'], 
      ['Germany','adminek','hopinek','50','1000'] 
     ]; 

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

     var markerCluster = new MarkerClusterer(map, markers, 
     {imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'}); 

     var markers = []; 

     for (var x = 0; x < infoUser.length; x++) { 

      var adresa = infoUser[x][0], 
       name = infoUser[x][1], 
       firstname = infoUser[x][2], 
       age = infoUser[x][3], 
       price = infoUser[x][4];  

      $.getJSON('http://maps.googleapis.com/maps/api/geocode/json?address='+adresa, null, function (data) { 
       var p = data.results[0].geometry.location; 
       var latlng = new google.maps.LatLng(p.lat, p.lng); 
       var marker = new google.maps.Marker({ 
       position: latlng, 
       title: adresa, 
       map: map 
       }); markers.push(marker); markerCluster.addMarker(marker); 

       var content = 'Adresa: ' + adresa + 'username: ' + name; 

       google.maps.event.addListener(marker,'click', (function(marker, content, infoWindow){ 
        return function() { 
         infoWindow.setContent(content); 
         infoWindow.open(map,marker); 
        }; 
       })(marker, content, infoWindow)); 
      }); 
     } 
    } 

Answer 1

您需要的地理编码器调用（adresa和name）之外的数据功能关闭，以及信息窗口content//infoWindow：

working fiddle

代码片段：

function initMap() { 
 
    var map = new google.maps.Map(document.getElementById('map'), { 
 
    zoom: 3, 
 
    center: { 
 
     lat: 49.7437895, 
 
     lng: 15.3360726 
 
    } 
 
    }); 
 
    //array 
 
    var infoUser = [ 
 
    ['Germany', 'Maj', 'TUC', '20', '300'], 
 
    ['Czech Republic', 'admin', 'Bla', '50', '400'], 
 
    ['Italy', 'HOOOO', 'BUC', '1', '50'], 
 
    ['Italy', 'aaaaa', 'aaa', '10', '20'], 
 
    ['Germany', 'adminek', 'hopinek', '50', '1000'] 
 
    ]; 
 

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

 
    var markerCluster = new MarkerClusterer(map, markers, { 
 
    maxZoom: 18, 
 
    imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m' 
 
    }); 
 

 
    var markers = []; 
 

 
    for (var x = 0; x < infoUser.length; x++) { 
 

 
    var adresa = infoUser[x][0], 
 
     name = infoUser[x][1], 
 
     firstname = infoUser[x][2], 
 
     age = infoUser[x][3], 
 
     price = infoUser[x][4]; 
 

 
    $.getJSON('http://maps.googleapis.com/maps/api/geocode/json?address=' + adresa, null, function(adresa, name) { 
 
     return function(data) { 
 
     var p = data.results[0].geometry.location; 
 
     var latlng = new google.maps.LatLng(p.lat, p.lng); 
 
     var marker = new google.maps.Marker({ 
 
      position: latlng, 
 
      title: adresa, 
 
      map: map 
 
     }); 
 
     markers.push(marker); 
 
     markerCluster.addMarker(marker); 
 

 
     var content = 'Adresa: ' + adresa + '<br>username: ' + name; 
 

 
     google.maps.event.addListener(marker, 'click', (function(marker, content, infoWindow) { 
 
      return function() { 
 
      infoWindow.setContent(content); 
 
      infoWindow.open(map, marker); 
 
      }; 
 
     })(marker, content, infoWindow)); 
 
     } 
 
    }(adresa, name)); 
 
    } 
 
} 
 
google.maps.event.addDomListener(window, "load", initMap);

html, 
 
body, 
 
#map { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<script src="https://cdn.rawgit.com/googlemaps/v3-utility-library/master/markerclustererplus/src/markerclusterer.js"></script> 
 
<div id="map"></div>