Question

我从谷歌

获得了这个修改过的示例代码

var stockholm = new google.maps.LatLng(59.32522, 18.07002);
var parliament = new google.maps.LatLng(59.327383, 18.06747);
var marker;
var map;

function initialize() {
    var mapOptions = {
        zoom: 15,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        center: stockholm
    };

    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

    marker = new google.maps.Marker({
        map:map,
        draggable:true,
        animation: google.maps.Animation.DROP,
        position: parliament,
        icon: '/img/marker.png'
    });
    google.maps.event.addListener(marker, 'click', toggleBounce);


    setTimeout(function() {  marker.setAnimation(google.maps.Animation.BOUNCE); }, 2000);

}

function toggleBounce() {

  if (marker.getAnimation() != null) {
    marker.setAnimation(null);
  } else {
    marker.setAnimation(google.maps.Animation.BOUNCE);
  }
}

我想知道在DROP动画停止后是否可以将标记动画从DROP更改为BOUNCE？

我设法使用setTimeout（）函数更改它，但它没有顺利完成。任何帮助将不胜感激。

Answer 1

尝试更改google.maps.event.addListener(map, 'idle', function ()...)上的标记动画 - 这将在添加标记后调用。

document.write('<script src="https://maps.googleapis.com/maps/api/js">\x3C/script>');

window.onload = function () {
    // Create map
    var map = new google.maps.Map(document.getElementById('map_canvas'), {
        zoom: 12,
        center: new google.maps.LatLng(-33.87, 151.24),
        mapTypeControlOptions: {
            mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style']
        }
    });

    // Create marker
    var marker = new google.maps.Marker({
        position: new google.maps.LatLng(-33.890542, 151.274856),
        map: map,
        animation: google.maps.Animation.DROP,
        title: 'Bondi Beach'
    });
  
    // On idle, change marker animation to bounce
    google.maps.event.addListener(map, 'idle', function () {
        marker.setAnimation(google.maps.Animation.BOUNCE);
    });
}

#map_canvas {
    width: 300px;
    height: 300px;
}

<div id="map_canvas"></div>

Answer 2

你可以试试这个。：

google.maps.event.addListener(marker, "dragend", function(event) { 
          marker.setAnimation(google.maps.Animation.BOUNCE);
        });

Google Maps API v3标记删除和退回动画

2 个答案: