leaflet polyline 动态画线

在 Leaflet 中实现动态画线，可以使用 `Polyline` 类和 `setLatLngs` 方法来实现。下面是一个简单的示例代码：

// 创建地图对象
var map = L.map('map').setView([51.505, -0.09], 13);

// 添加地图瓦片图层
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors',
}).addTo(map);

// 创建空的 Polyline
var polyline = L.polyline([], {color: 'red'}).addTo(map);

// 模拟动态更新线的坐标
var coordinates = [[51.5, -0.09], [51.51, -0.1], [51.52, -0.12], [51.53, -0.14]];

// 定时更新线的坐标
var index = 0;
setInterval(function() {
  polyline.setLatLngs(coordinates.slice(0, index + 1));
  index = (index + 1) % coordinates.length;
}, 1000);

这段代码会在地图上绘制一个红色的折线，并模拟每秒钟更新折线的坐标。