javascript - 随鼠标滚动画出曲线

Question

我想实现的效果是，当页面向下滚动时，画出一条曲线。类似
http://image.thepaper.cn/html/zt/2015/re...
这个页面中下图所示的效果

请问如何能最简单的实现？

Answer 1

好像是d3 + leaflet做的
坐标应该都是json格式化好的

如果你做的完全是从上到下结构的，我觉得可以这么做
做3层结构
底层一个图片，active状态下的路线图
中间一个图片，inactive状态下的路线图
最上次就是各种地名

scroll的时候，不断将中间图片的css，这样就应该会有路线向下走的效果

Answer 2

看效果第一反应应该是用svg画的，虽然结果不是 - -
可以参考这个http://www.webhek.com/animated-line-draw...