Hoạt ảnh ngược lại để xóa đánh dấu Google Map?

Question

Tôi biết tôi có thể tạo hiệu ứng "thêm" của điểm đánh dấu trên bản đồ google, a la https://developers.google.com/maps/documentation/javascript/overlays#MarkerAnimations

Tôi có thể làm hoạt ảnh ngược lại để xóa điểm đánh dấu khỏi bản đồ không? Tôi muốn nó bay trở lại lên trên cùng của bản đồ trên loại bỏ đánh dấu ... là có thể?

Đây là mã remove tôi cho đến nay (chỉ cần loại bỏ nó ra khỏi bản đồ, không có hình ảnh động):

// TODO figure out if there is a way to animate this removal, like the add 
$.contextualMap.prototype.removeMarker = function(m) { 
    m.mapMarker.setMap(null); 
    m.mapMarker = null; 
}; 

Answer 1

Vì google.maps.Animation không hỗ trợ hoạt ảnh thả ngược, bạn cần viết tập lệnh của riêng bạn để tạo hoạt ảnh cho điểm đánh dấu.

Bạn có thể viết một cái gì đó như thế này:

function removeMarkerWithAnimation(map, marker){ 
    (function animationStep(){ 
     //Converting GPS to World Coordinates 
     var newPosition = map.getProjection().fromLatLngToPoint(marker.getPosition()); 

     //Moving 10px to up 
     newPosition.y -= 10/(1 << map.getZoom()); 

     //Converting World Coordinates to GPS 
     newPosition = map.getProjection().fromPointToLatLng(newPosition); 
     //updating maker's position 
     marker.setPosition(newPosition); 
     //Checking whether marker is out of bounds 
     if(map.getBounds().getNorthEast().lat() < newPosition.lat()){ 
      marker.setMap(null); 
     }else{ 
      //Repeating animation step 
      setTimeout(animationStep,10); 
     } 
    })(); 
} 

Đây là DEMO:

Answer 2

Ý tưởng của tôi:

1. tạo GIF động của một pin marker bay, sau đó biến mất.
2. trên sự kiện xóa điểm đánh dấu, hoán đổi icon để hiển thị GIF
3. Vì bạn đã tạo GIF, bạn nên biết thời lượng hoạt ảnh. Sau đó, setTimeout với giá trị này để gọi setMap (null)

Nó có thể ngăn chặn sự kiện tuyên truyền, một trong nhiều nhược điểm có thể xảy ra.