javascript - 获取存储在谷歌地图标记的附加字段中的数据

Question

我正在使用我不太熟悉的谷歌地图 API 和 javascript。这是我用来在 map 上绘制标记的代码。我从数据库中获取纬度和经度:

    var geocoder;
    var map;
    var jsonStr = '<?php echo json_encode($arajka) ?>';
    var LatLong = JSON.parse(jsonStr);
    function initialize() {
        geocoder = new google.maps.Geocoder();
        var mapOptions = {
          center: new google.maps.LatLng(50.000001, 20.000001),
          zoom: 12
        };
        map = new google.maps.Map(document.getElementById("map-canvas"),
            mapOptions);
        var marker = [];

        for(var i=0;i<LatLong.length;i++){

           var LatLong1 = new google.maps.LatLng(LatLong[i].lat, LatLong[i].lon);
        marker.ajdi=LatLong[i].id; // storing additional data (I need to get it when user clicks on certain marker)
           marker.push(new google.maps.Marker({position: LatLong1, map: map, title: LatLong[i].login}));

        }
                    // trying to set some listener but it fails.
        google.maps.event.addListener(marker, 'click', function() {
            map.setZoom(8);
            map.setCenter(marker.getPosition());
            alert("ASDASDASD" + marker.ajdi);
        });
    }

所以，这个监听器不起作用，我不知道为什么。好吧，我希望它并不确切知道它是关于什么标记的。当我尝试用一​​个单独的东西来做时，就像在教程中一样，它工作正常。当我拥有这个数组时，我不知道该怎么办。请问有什么建议吗？

Answer 1

您的代码中有几个错误:

1. 正如 @Hollister 提到的，marker 是一个数组，因此您需要将 addListener 调用放在循环内；

2. 您必须将附加标记数据存储到标记中，而不是存储到标记数组中；

3. 您必须在监听器中使用this，而不是marker。

   for(var i=0;i<LatLong.length;i++){
   
      var LatLong1 = new google.maps.LatLng(LatLong[i].lat, LatLong[i].lon);
      var this_marker = new google.maps.Marker({position: LatLong1, map: map, title: LatLong[i].login});
      this_marker.ajdi=LatLong[i].id; // storing additional data (I need to get it when user clicks on certain marker)
      marker.push(this_marker);
   
               // trying to set some listener but it fails.
      google.maps.event.addListener(this_marker, 'click', function() {
          map.setZoom(8);
          map.setCenter(this.getPosition());
          alert("ASDASDASD" + this.ajdi);
      });
   }