javascript - 我们如何在谷歌地图中添加带有点击事件的多个标记？

Question

这个问题已经有答案了:

Google Maps JS API v3 - Simple Multiple Marker Example (15 个回答)

已关闭 8 年前。

我正在使用下面的代码，但我对点击事件有点困惑。如何在每个标记上添加点击事件？

        var address = 'Dubai';
     var neighborhoods = [
       new google.maps.LatLng(25.23247465817403, 55.30191340351564),
       new google.maps.LatLng(25.244586082480332, 55.29822268391115),
       new google.maps.LatLng(25.230844181976337, 55.32225527668459),
       new google.maps.LatLng(25.224787936110832, 55.28526224995119)
     ];
     var markers = [];
     var iterator = 0;
     var map;
     var geocoder = new google.maps.Geocoder();
     function initialize() {
         var mapOptions = {
             zoom: 12,
         };
         map = new google.maps.Map(document.getElementById('mapCanvas'),
                 mapOptions);
         geocoder.geocode({
             'address': address
         },
         function (results, status) {
             if (status == google.maps.GeocoderStatus.OK) {
                 map.setCenter(results[0].geometry.location);
             }
         });
     }
     function drop() {
         for (var i = 0; i < neighborhoods.length; i++) {
             setTimeout(function () {
                 addMarker();
             }, i * 200);
         }
     }
     function addMarker() {
         var image = 'img/flagred.png';
         markers.push(new google.maps.Marker({
             position: neighborhoods[iterator],
             map: map,
             icon: image,
             title:"Hello World!",
             draggable: false,
             animation: google.maps.Animation.DROP
         }));
         iterator++;
     }

我在这里查看了其他答案，但这并没有解决我的问题。

Answer 1

只需将其添加到您添加到 map 中的每个标记即可。因此将 addMarker-definition 更改为

function addMarker() {
     var image = 'img/flagred.png';
     var marker = new google.maps.Marker({
         position: neighborhoods[iterator],
         map: map,
         icon: image,
         title:"Hello World!",
         draggable: false,
         animation: google.maps.Animation.DROP
     });
     markers.push(marker);

     google.maps.event.addListener(marker, 'click', function() {
         // your magic goes here
     });

     iterator++;
 }