网站 › 『编程语言讨论求助区』 › Echarts折线图动画实现

殤丶 发表于 2021-5-25 17:13

Echarts折线图动画实现

请教各位大佬，目前画了一个折线图，需要有个光点沿着折线上移动。类似于下图；

白色的线顺着数据渲染的蓝色的线，从左至右，移动


翻遍了echarts官方的指导文档，实在没辙，问问各位大佬。

无敌小儿 发表于 2021-5-25 17:18

添加个时间轴，推荐用easyshu插件。

芯醉紅颜 发表于 2021-5-25 17:52

百度搜索一下

18730630806 发表于 2021-5-25 18:18

利用原数据，在延迟渲染一条折线，覆盖效果

云烟成雨 发表于 2021-5-25 21:38

只能自己写或者换别的插件了

什么是神魔 发表于 2021-5-26 15:36

原理应该也是覆盖，貌似可以通过effect实现，请参考：https://github.com/apache/echarts/issues/6186
还找到个官方示例，路径图特效
https://echarts.apache.org/examples/zh/editor.html?c=lines-bmap-effect

殤丶 发表于 2021-5-27 16:31

什么是神魔 发表于 2021-5-26 15:36
原理应该也是覆盖，貌似可以通过effect实现，请参考：https://github.com/apache/echarts/issues/6186
还 ...

感谢，我去看看

zach14c 发表于 2021-5-27 21:34

原理大概就是这个样:
https://jsfiddle.net/zach14c/jnboc7ek/

殤丶 发表于 2021-5-28 08:26

zach14c 发表于 2021-5-27 21:34
原理大概就是这个样:
https://jsfiddle.net/zach14c/jnboc7ek/

兄弟，这个网址打不开啊{:1_937:}

zach14c 发表于 2021-5-28 08:38

殤丶 发表于 2021-5-28 08:26
兄弟，这个网址打不开啊

试试这个

http://jsdm.com/anon/paint/nVuw9

查看完整版本: Echarts折线图动画实现