Question

尝试将点击绑定到Google地图画布上的链接，该链接将打开＆＃34; infowindow＆＃34;在地图上。我知道如何针对特定点进行操作，但我需要动态地进行，因为显示的点总是不同的。

以下是我尝试绑定点击的方式：

for (var i = 0; i < 6; i++) {
    var pointString = '<a href="#" class="openPoint" id="point' + i + '">' + myPoints[i][0] + ' - ' + myPoints[i][1] + ' Miles Away</a>';
    $('#pointsGoHere').append(pointString);
    $('#point' + i).click(function (e) {
        e.preventDefault();
        //HOW DO I OPEN THE INFOWINDOW TO THE CORRESPONDING MAP MARKER IN THIS CLICK?
    });
}

以下是我稍微缩短的Google地图代码，以便您了解我如何使用它：

var geocoder;
var map;

function initialize() {

    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(40.75919, -73.984868);
    var mapOptions = {
        center: latlng,
        zoom: 11
    };
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    var myLatLng0 = new google.maps.LatLng(40.8752743, -74.0286719);
    mapMarker0 = new google.maps.Marker({
        position: myLatLng0,
        map: map,
        title: 'Origal LLP'
    });
    var contentString0 = '<div id="content0"><div id="siteNotice0"></div><div id="bodyContent0"><div style="display:inline; float:left"><h4>Origal LLP</h4></div></div></div>';

    infowindow0 = new google.maps.InfoWindow({
        content: contentString0
    });
    google.maps.event.addListener(mapMarker0, 'click', function () {
        infowindow0.open(map, mapMarker0);
        map.setCenter(mapMarker0.getPosition());
        map.setZoom(15);
    });


    var zip = $('#zip').val();
    geocoder.geocode({
        'address': zip
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            calculateDistance(results[0].geometry.location);
        } else {
            alert('Geocode was not successful for the following reason: ' + status);
        }
    });

    function calculateDistance(latLonClient) {
        var loc0 = new google.maps.LatLng(40.8752743, -74.0286719);

        var clientAndPoint0 = Math.round(google.maps.geometry.spherical.computeDistanceBetween(latLonClient, loc0) * 0.000621371192);

        var myPoints = new Array();
        myPoints[0] = ['Origal LLP', clientAndPoint0, '244 Leonia Ave, Bogota, NJ 07603', 'infowindow0', mapMarker0];
        myPoints.sort(function (b, a) {
            if (a[1] < b[1]) return 1;
            if (a[1] > b[1]) return -1;
            if (a[1] > b[1]) return 1;
            if (a[1] < b[1]) return -1;
            return 0;
        });

        map.setCenter(myPoints[0][4].getPosition());
        map.setZoom(15);


        for (var i = 0; i < 6; i++) {
            var pointString = '<a href="#" class="openPoint" id="point' + i + '">' + myPoints[i][0] + ' - ' + myPoints[i][1] + ' Miles Away</a>';
            $('#pointsGoHere').append(pointString);
            $('#point' + i).click(function (e) {
                e.preventDefault();

            });
        }
    }

}

这是我第一次使用谷歌地图，仍然得到了事情的要点，我知道我可以压缩这些代码，但尚未到达那里，我为臃肿而道歉。感谢您的帮助，如果我已经错过了我需要的答案，我会道歉。

Answer 1

这应该做你想要的。

google.maps.event.trigger(point, "click");

所以这样做：

for (var i = 0; i < 5; i++) {
    var pointString = '<li><a href="#" class="openPoint" id="point' + i + '" pointID="' + i + '">' + myPoints[i][0] + ' - ' + myPoints[i][1] + ' Miles Away</a></li>';
    $('#pointsGoHere').append(pointString);
}
$('.openPoint').each(function () {
    $(this).click(function (e) {
        e.preventDefault();
        var pointID = parseInt($(this).attr('pointID'));
        google.maps.event.trigger(myPoints[pointID][4], "click");
    });
});

动态绑定点击谷歌地图标记链接

1 个答案: