如何使用PolylineDecorator在多义线的每行末端放置一个箭头？

Question

我正在尝试使用PolylineDecorator制作传单。我打算在每行的末尾绘制一条带有箭头的折线。我有以下代码：

var somePoints = [];
for (var rowIndex in rows) {
    somePoints.push(L.latLng(rows[rowIndex].Lat, rows[rowIndex].Lon));
}
var pl = L.polyline(somePoints);
pl.addTo(map);
var decorator = L.polylineDecorator(pl, {
    patterns: [
        // defines a pattern of 10px-wide dashes, repeated every 20px on the line
        {offset: 0, repeat: 50, symbol: L.Symbol.arrowHead({pixelSize: 8, polygon: false, pathOptions: {stroke: true}})}
    ]
}).addTo(map);

产生这个

我的意图是在行的每一端（标记位置）都放一个箭头。如果我改变offset来"100%"和repeat到0，然后我有这样的：

我们在最后一个标记处有一个箭头，但其他标记没有箭头。我知道我们可以通过将每条线绘制为带有offsetof "100%"和repeatof 的单独的折线来实现我想要的功能0，但是我想知道是否可以使用在参数中具有两个以上点的单条折线来实现decorator。这是可能的还是我应该修改我的代码以使n-1条带有箭头的折线？

Answer 1

我知道这很愚蠢，但实际上我正在为此目的构建插件：

https://github.com/slutske22/leaflet-arrowheads

根据评论中的要求，这是一个带有一堆示例的有效代码和框：https ://codesandbox.io/s/leaflet-arrowheads-example-zfxxc

我几乎完成了自述文件的充实，很快就会要求将其添加到传单插件列表中。如果您觉得有帮助/更多功能请求/一般反馈，请告诉我您的想法。