Googleマップのマーカーが重複する

Question

問題が発生しました。私はGoogleマップを使用して簡単なアプリを持っています。私は2つのモニターで作業し、1つのモニターでブラウザーを開いて他のモニターにドラッグすると、アニメーションを追加した後にマーカーが複製されることに気付きました。他の誰かがこれを見つけたか、それを修正する方法を知っていますか？問題は自分のコードですか、それともGoogleマップのバグですか？

大きな問題ではありませんが、私を悩ますだけで十分です。

私は自分の状況を再現するためにjsfiddleを作成しました。 1台のモニターにjsfiddleを開き、それを他のモニターにドラッグしてから、「バウンス」ボタンをクリックします。この問題は、開発ツールを開いて別のデバイスを選択した場合にも表示されます。

https://jsfiddle.net/x4gM4/11/

HTML：

<div id="map-canvas" style="height:300px;width:600px;background-color:#CCC"></div> 
<button id="button"> 
BOUNCE 
</button> 

Javascriptを：奇数1の

var marker; 
var map; 
function initialize() { 
    var myLatLng = new google.maps.LatLng(45.4375, 12.3358), 
     myOptions = { 
      zoom: 5, 
      center: myLatLng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
    map = new google.maps.Map(document.getElementById('map-canvas'), myOptions), 
     marker = new google.maps.Marker({ 
     position: myLatLng, 
     map: map 
    }); 
    document.getElementById("button").addEventListener("click", bounceMarker); 
}; 

function bounceMarker() { 
     if(marker.getAnimation() == null){ 
     marker.setAnimation(google.maps.Animation.BOUNCE); 
     setTimeout(function(){ 
     marker.setAnimation(null); 
     }, 700); 
    } 
}; 

initialize(); 

Answer 1

ビットが、それはあなたのbounceMarker（）関数でやっていたようです。私はそれを単純化しています

function bounceMarker() { 

    marker.setAnimation(google.maps.Animation.BOUNCE); 

}; 

、問題が消える - https://jsfiddle.net/8jmw24ee/