重绘折线传单答案

【问题标题】：Redraw Polyline Leaflet重绘折线传单
【发布时间】：2017-07-24 18:33:25
【问题描述】：

我有一条包含多个点的折线，我想在我重新排列这些点的循环内多次重绘它。我使用了 setLatLngs 函数，但它似乎重绘了整个折线一次。

如何在循环中重绘折线？

代码如下：

test()
{
    for (var i=0;i<100;i++)
    {
        this._polyline.setLatLngs(this.shuffle(this._polylinePoints));
    }
}

Here 是一个 jsfiddle。

谢谢！

【问题讨论】：

你能解释更多你在这里寻找什么吗？
是的，当然，snkashis。在测试功能中，折线应该重绘一百次，但它只重绘一次。如果你按下 jsfiddle 中的“测试”按钮，测试功能就会被执行，我希望看到折线被重绘了一百次，但它被重绘了一次。我需要多次重画折线，因为我要多次替换折线中的所有点。
但它被重绘了很多次，你只是看不到它。使用 `self = this; 在您的 test() 中观看我所说的内容； for (var i=0;i
是的，snkashis，你是对的。我需要在每次迭代中查看重绘的折线。我该怎么做？
好吧，就像我之前的例子......你为什么不设置一个函数，在你正在寻找的持续时间内使用setTimeout 递归调用自己？

标签： leaflet polyline

【解决方案1】：

所以，因为如果你想在一定时间内查看每次迭代的配置......你可能不得不使用setTimeout，就像下面的例子一样。或者做一些递归代替。在这里我只是不断地做超时时间越大，递归方法的效率越高。

self = this; 
for (var i=0;i<100;i++) { 
   setTimeout(function() {
       self._polyline.setLatLngs(self.shuffle(self._polylinePoin‌ts));
   },1000*i) 
}

下面是递归示例

self = this;
var runs = 0;

shufflePoints = function() {
    if (runs < 100) {
      runs++;
      self._polyline.setLatLngs(self.shuffle(self._polylinePoin‌ts));
      setTimeout(function() {
       shufflePoints()
      },1000)
    }
}

【讨论】：