echarts折线图X轴增加Slider滑块?-灵析社区

ciiiiinema

1. 图片来源:模仿"饿了么外卖"折线图筛选功能 2. 这个图应该如何实现呢、滑动Slider滑块、对应折线图也随之高亮展示 3. 目前发现一个类似的功能[https://github.com/oguzhaninan/vue-histogram-slider](https://link.segmentfault.com/?enc=9K2bT%2BvypZhTWbhfbOWjyQ%3D%3D.boE3NTo9los2Pf5eTtIPK8dCms235Cp4xyrlOJmCTop1DDnIynSVfzJKgiXRBytxJX%2BSQXLVvG016v7HmKot0w%3D%3D)只不过他是柱形图而我是折线图 ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250109/d2599164c0d312cb9f2b43a2ced81559.png) ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250109/5acd25e1530bf5cc1a339354768a57d1.png) 目前使用echarts中visualMap属性可以实现如图中这个部分、但是出现的问题是折线图与下边的滚轴达不到一样宽的效果、此部分该如何处理? ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250109/6990e2bb0dbbfe8a93fa1b1160de5088.png)

阅读量:249

点赞量:11

问AI
楠楠不难难
"https://echarts.apache.org/zh/option.html#dataZoom" (https://link.segmentfault.com/?enc=2xLkqaK109KkXK5aIp2qtQ%3D%3D.nmJyrMs150WyinAhv7jMj0oLvlHpBmMtck4uCAtMiU%2BSieguqIH0kxrLavmUr4%2FrIZqau5hL7NHxmr2h8j34Zw%3D%3D) "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20250109/d006066d2336b5ee9e8061ea1637724d.png) 这种效果你看满不满足,其实还有echarts都有实现,你可以找找