Данные Маркера Карт Google

Question

В настоящее время я выполняю ajax-вызов на сервер, чтобы получить список значений lat / long для отображения на карте Google. Я также прикрепил событие "click" к каждому маркеру. Хитрость в том, что мне нужно иметь возможность хранить немного дополнительных данных в маркере, чтобы знать, с каким ID (из базы данных), с которым я имею дело, поэтому я сопоставляю его с базой данных позже. Я использую свойство Заголовок для отображения некоторой дружественной информации. AJAX, создание маркера и событие click работают нормально. Как правильно хранить дополнительные данные для маркера? Смотрите код здесь:

$.ajax({
    url: "/location/NearbyHotspots",
    data: {
        lat: marker.position.lat(),
        lng: marker.position.lng(),
        radius: 10
    },
    datatype: "json",
    type: "POST",
    success: function (data, status, xhttp) {
        for (var i = 0; i < data.length; i++) {
            var loc = new google.maps.LatLng(data[i].Lat, data[i].Long);
            var newmarker = new google.maps.Marker({
                position: loc,
                draggable: false,
                map: map,
                title: data[i].Name
            });

            // This doesn't seem to work
            newmarker.hotspotid = data[i].ID;
            google.maps.event.addListener(newmarker, "click", function(mark) {
                alert(mark.hotspotid);
            });
        }
    },
    error: function (jqXHR, textStatus, errorThrown) {
        alert(textStatus);
    }
});

Answer 1

ХА!Я понял."это" сделал это!

google.maps.event.addListener(newmarker, "click", function(mark) {
    alert(this.hotspotid);
});  

Answer 2

Я думаю, что ваш подход правильный, это просто неправильный обработчик событий.В вашем обработчике

function(mark) {
    alert(mark.hotspotid);
}

Аргумент mark - это не маркер, как вы ожидаете, а MouseEvent (, подробности см. В справочнике по API ).

Чтобы это исправить, вам нужно использовать замыкание, чтобы передать ссылку на маркер.Это усложняется циклом - вы не можете просто использовать ссылку на newmarker, поскольку она всегда будет ссылаться только на последний маркер в цикле.Есть несколько различных способов исправить это, но самый простой - прикрепить событие click в отдельной функции:

success: function (data, status, xhttp) {
    // define a function to attach the click event
    function attachClickEvent(marker) {
        google.maps.event.addListener(marker, "click", function() {
            // the reference to the marker will be saved in the closure
            alert(marker.hotspotid);
        });
    }
    for (var i = 0; i < data.length; i++) {
        var loc = new google.maps.LatLng(data[i].Lat, data[i].Long);
        var newmarker = new google.maps.Marker({
            position: loc,
            draggable: false,
            map: map,
            title: data[i].Name
        });

        newmarker.hotspotid = data[i].ID;
        attachClickEvent(newmarker);
    }
},