通过对leaflet以及其插件的学习，咱们理解到应用Leaflet.Path.DashFlow插件可实现轨迹动静展现、管道流向动静展现、河流流向动静展现等，达到加强可视化展现的成果。该插件应用形式非常简单，只需在失常增加线的时候，退出dashArray和dashSpeed参数即可。外围代码如下：
留神，在dashSpeed为负时，线是正向流动。成果如下：
然而在应用的过程中，发现该插件有个弊病，就是当应用Canvas形式绘制地图（初始化地图preferCanvas参数为true）时，动态效果不可用。那要如何解决这个问题呢？
通过对Leaflet.Path.DashFlow以及leaflet源码的钻研，发现动静线的成果次要是通过动静刷新dashOffset参数的值，以扭转线的款式来实现。
L.SVG在_updateStyle的时候，更新了dashOffset参数，然而L.Canvas在_updateStyle时，并没有更新dashOffset参数。这即是在Canvas形式绘制时没有动态效果的起因。
L.SVG：
L.Canvas：
由此，咱们找到了解决思路，即在L.Canvas的_updateStyle办法中，参考L.SVG的解决形式，增加对dashOffset参数的管制。外围代码如下：
为方便使用，咱们将L.Path.DashFlow插件从新封装，大家援用这个插件，即可在Canvas和SVG两种形式下应用此插件。
总结
- 应用
Leaflet.Path.DashFlow插件可实现轨迹动静展现、管道流向动静展现等动静线成果。 - 默认插件在应用
Canvas形式绘制地图（初始化地图preferCanvas参数为true）时，动态效果不可用。 - 通过批改
L.Canvas中代码，即可在Canvas形式时实现动静线成果。 - 将
L.Path.DashFlow插件从新封装，援用插件，即可在Canvas和SVG两种形式下实现动静线成果。
在线示例
[在线示例](
http://gisarmory.xyz/blog/ind...
[残缺代码](
http://gisarmory.xyz/blog/ind...
原文地址：http://gisarmory.xyz/blog/index.html?blog=LeafletPathDashFlow。
关注《GIS兵器库》公众号， 第一工夫取得更多高质量GIS文章。
本文章采纳 常识共享署名-非商业性应用-雷同形式共享 4.0 国内许可协定 进行许可。欢送转载、应用、从新公布，但务必保留文章署名《GIS兵器库》（蕴含链接： http://gisarmory.xyz/blog/），不得用于商业目标，基于本文批改后的作品务必以雷同的许可公布。