谷歌地图API v3:标记并不总是持续反弹

Question

我对谷歌地图标记的反弹动画有一些问题.基本上,我在地图右侧的列中有一个主题列表.在每个主题下面列出了与其连接的标记的名称,以及用于可视地显示/隐藏标记的复选框.我想让相应的标记在将鼠标悬停在其链接的复选框上时连续弹跳,并在用户停止悬停在复选框上时立即停止弹跳.我现在有以下代码:

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应用程序中挣扎了大约一个小时才解决这个问题:/