javascript - 谷歌地图 API v3 : Markers don't always continuously bounce

Question

我在使用谷歌地图标记的弹跳动画时遇到了一些问题。
基本上，我在 map 右侧的列中有一个主题列表。在每个主题下方列出的是与其连接的标记的名称，并带有复选框以直观地显示/隐藏标记。我想让相应的标记在其链接的复选框上悬停时连续弹跳，并在用户停止将鼠标悬停在复选框上时立即停止弹跳。我目前有以下代码:

HTML:

<input type=\"checkbox\" onmouseenter=\"highlightPoint( " + (amountOfPoints - 1) + " )\" onmouseleave=\"removePointHighlighting( " + (amountOfPoints - 1) + " )\" /> "

Javascript:

function highlightPoint( pointIndex ) {
        window["point" + (pointIndex+1)].setAnimation(google.maps.Animation.BOUNCE);
    }

    function removePointHighlighting( pointIndex ) {
        console.log( "remove animation" );
        window["point" + (pointIndex+1)].setAnimation( null );
    }

这段代码几乎按预期工作，除了一个小问题。有时动画在悬停时会连续播放，但有时在离开悬停状态后，再次悬停后，弹跳动画只播放一次，然后停止。发生这种情况的时间或原因似乎是相当随机的。动画只播放一次后，将不再继续播放，直到页面刷新。我猜这与动画背后的一些计时器有关？我发现以下代码仅用于播放弹跳动画一次:

setTimeout(function(){ marker.setAnimation(null); }, 750);

有没有办法在mouseleave上“重置”这些计时器，或者是否有其他原因导致动画出错？对于我正在制作的应用程序来说，这是一个相对不重要的功能，但我仍然想知道这里有什么问题..

编辑:这似乎是特定于浏览器的问题。在 Safari 和 Firefox 中进行测试时，弹跳没有任何问题。奇怪地指定的问题只发生在 Chrome 中。通常，动画一旦设置为null，之后再设置，它只会播放一次。只有在第一次鼠标悬停时，弹跳才会连续播放。奇怪的..

Answer 1

不要将动画设置为 null，而是将其设置为 -1。动画常量只是整数。在弄清楚这一点之前，我在我的 vuejs 应用程序中为这个问题苦苦挣扎了大约一个小时:/