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

标签 javascript jquery google-maps google-maps-api-3 google-maps-markers

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

        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++;
     }

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

最佳答案

只需将其添加到您添加到 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++;
 }

关于javascript - 我们如何在谷歌地图中添加带有点击事件的多个标记?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25190955/

相关文章:

javascript - 如何将 javascript 变量放入 url 中?

javascript - Jquery Animate + fadeInOut 元素

javascript - 为什么这个 Promise 不能正常工作?

jquery - 如何以 jquery 风格做到这一点

javascript - 无法在 map 单击监听器事件上显示另一个 map

javascript - 在所有其他脚本之后加载 javascript

javascript - 使用 PHP 更新部分网页

android - 我的位置按钮事件监听器

android - 如何制作可变的 ItemizedOverlay

javascript - angularjs 从一个巨大的列表中更新单个元素