停止多段线上的动画符号 - googlemaps [英] Stop animation symbol on polyline - googlemaps

问题描述

根据这个非常有用的答案，我在多段线上使用了动画符号：
多个测地线上的动画符号

I used the animation for symbols on polylines according to this answer that was very useful: Animate symbol on multiple geodesic polylines

我想要的是有多条多段线，并在选择一条多段线时生成动画，并停止动画其他人。

What i would like is to have several polylines and generate animation when one is selected and stop animation for the others.

也就是说，我想删除符号并停止动画，一旦它开始使用上述方法：

That is, i want to remove symbol and stop animation once it has started with the method mentioned above:

function animateCircle(id) {
    var count = 0;
    offsetId = window.setInterval(function () {
        count = (count+1) % 200;
        id.setOptions({
            icons: [{
                offset: (count/2)+'%'
            }]
        });
    }, 20);
};

我尝试了另一个像这样的函数，但它根本不起作用：

I tried another function like this but it didn't work at all:

function stopCircle(id) {
    id.setOptions({
        icons: [{
            offset: '0%'
        }]
};

都不是：

function stopCircle(id) {
    id.setOptions({
        icons: null
};

谢谢。

Thanks.

推荐答案

id是你的多段线阵列的一个索引，要访问多段线，你需要使用多段线[id]（即多段线[id] .setOptions。

id is an index into your array of polylines. To access the polyline you need to use polylines[id] (i.e polylines[id].setOptions.

也想停止计时器，因为你需要保持对setInterval返回值的引用。

You probably also want to stop the timer, for that you need to keep a reference to the value returned by setInterval.

工作示例

function stopCircle(id) {
    clearInterval(polylines[id].handle);
    polylines[id].polyline.setOptions({
        icons: null});
};

其中，polylines数组现在包含：

Where the polylines array now contains:

    polylines[i] = new Object();
    polylines[i].polyline = polyline;
    polylines[i].handle = animateCircle(i);

这篇关于停止多段线上的动画符号 - googlemaps的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！