折线的小叶过渡

如何解决折线的小叶过渡

一般来说，我对angular和frontend还是陌生的，如果这个问题很傻，我感到抱歉。

我目前正在显示带有传单的地图，其中有3个标记和一条折线将它们连接起来，如下所示：

我希望看到一条从折线到此折线的过渡：

我看不到从图片1到图片2的过渡。

我正在努力实现您在此站点上看到的效果：https://tspvis.com/

连接每秒变化一次。

这是代码：

    run() {
        this.show1();
        this.show2();
      }

  

    show1() {
        const markers = [
          [51.5006728,-0.1244324],[51.5077286,-0.1279688],[51.503308,-0.119623]
        ];
        this.pl = L.polyline(this.markers,{ color: 'blue' });
        this.pl.addTo(this.map);
      }

  show2() {
    this.pl.remove(this.map);
    const markers2 = [
      [51.5077286,[51.5006728,-0.119623]
    ];

    var polyline2 = L.polyline(markers2,{ color: 'blue' });
    polyline2.addTo(this.map);
  }

这只是一个例子。将来，我将迭代运行此命令，以实时查看所有路径。