Question

我从我的webAPI获取了一组用户的json对象。我可以在他们的位置正确显示每个用户的标记，但是当我点击每个用户获取被点击的项目时我无法工作，我总是从列表中的最后一个获取信息。

这是我用来将它们放在地图上的代码：

var markers = [];

for ( var i = 0; i < size; i++) {
    var zIndex = membersList[i].type; 
    var latLng = new google.maps.LatLng(membersList[i].latitude,
            membersList[i].longitude);
    var marker = new google.maps.Marker({
        'position' : latLng,
        'shadow' : null,
        'zIndex' : zIndex,
        'title'  : membersList[i].username,
        'id'     : i,
        'icon' : markerImage[membersList[i].type]
    });

    google.maps.event.addListener(marker, 'click', function()
    {
        console.log(marker.id);
        var clicked = membersList[marker.id];
        var mType = ['', 'Couple', 'Male', 'Female'];
        var textType = mType[clicked.type];
        var userName = clicked.username;
        $(this).simpledialog2({
            mode: 'button',
            headerText: "OPTIONS",
            headerClose: true,
            buttonPrompt:  userName+ ' ('+textType+')',
            buttons : {
                'PROFILE': {
                    click: function () {
                        toUser = userName;
                        loadPage('profile');
                    },
                    icon: "info"
                },
                'MESSAGE': {
                    click: function () { 
                        toUser = userName;
                        loadPage('compose');
                    },
                    icon: "star",
                }
            }
        });
    });

    markers.push(marker);
}

markerCluster.addMarkers(markers);

顺便说一下，我使用markerClusterer以一些缩放级别显示在地图上分组的标记。

Answer 1

您正在使用在您点击功能之外定义的标记。

您需要查看的是google maps api，并了解如何获取点击的标记ID

标记在循环中递增，并且始终是最后创建的标记

Answer 2

这永远不会太晚，所以，如果我理解正确的话，这就是你需要的方法。

在对标记进行实例化时，请在完成各个设置后将它们添加到数组中。

var MySiteWithMap = { 
    markersArray : [], //Markers array
    map : {}, //Map object instance
    init : function() {

       var mapCanvas = document.getElementById("map");
       var mapOptions = {
         center : new google.maps.LatLng(-26.816667, -65.216667),
         zoom : 11
       };
       this.map = new google.maps.Map(mapCanvas,mapOptions);

       /*
       The following is used to get the Lat and Lng where the user clicks. 
       It may be useful to store the last coordinate where the user clicked.
       */
       this.map.addListener("click", function(event){
          var lat = event.latLng.lat();
          var lng = event.latLng.lng();
          console.log("Lat: "  + lat + "  Lng: "  +  lng);
       });

       MySiteWithMap.initMarkers();

    },
    initMarkers : function(url){
         $.get(url).done(function(result){
            var lat;
            var lng;
            $.each(result,function(index,element){
               lat = element.Latitud;
               lng = element.Longitud;

               var position = new google.maps.LatLng(lat,lng);

               var marker = new google.maps.Marker({
                   position : position,
                   map : _this.map,
                   id : element.id //Supposing it's a primary key from the DB or some other unique id.
               });
               marker.addListener('click',function(){
                   console.log(this.id)
               });

               Mapas.markersArray[marker.id] = marker; 
        })
    }
}

通过这样做，您有一组Marker对象。如果您想获得对特定标记实例的引用，则可以选择获取所单击标记的ID并在“markersArray”上查找它。

如果您想获得标记的位置（或任何其他属性），您可以执行以下操作：

console.log(MySiteWithMap.markersArray[123].position)

希望这有帮助！

谷歌地图API v3，无法获得点击标记

2 个答案: