Echart出现连线混乱的情况,如动态X轴以及数据实时刷新时,出现连线乱跳、飞线的原因分析

划重点,X轴的值重复了!
我猜测,Echart在动态增加新的数据时,包括横坐标数值,他的顺序是,先移位,再从数组中去掉最早的数据,然后才增加最新的数据,并不是同时进行的。因此当最新增加的值对应的横坐标的值,刚好与最早的,将要剔除的值的横坐标值相等时,就会出现,下一跳的连线,先连到最早的那个值的位置,然后等到最新的值出现时,才连回正确的位置。
因此,我们猜测,在添加下一跳的值,他的X坐标在X轴中间位置存在重复值,可能也会出现,先连接到已经存在的X坐标位置,(因为这时候最新的值还没出现),等到最新的值出现了,才会连接到最新的位置,这样就出现了飞线的现象。
因此,需要仔细检查一下你的X轴的值,是否有重复,如果下一跳出现的值对应的X轴的值在横轴中已存在,很有可能就会出现这个情况,下一跳的连线就会连接到重复了的那个横坐标对应的X轴的那个位。
因此,重要的事再说一遍,X轴的值尽量不要重复。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
# 大屏数据可视化 ## 重要声明 本项目所有案例采用的数据均属虚构,切勿当真! ## 项目案例 - 上市公司全景概览 综合使用条形图、柱状图、折线图、饼图、地图、数字翻牌器来实现一个常规的大屏数据可视化项目。 ## 项目案例 - 上市公司地域分布 以百度地图为底图,结合ECharts绘制地理信息数据 ## 旭日图 - 基于ECharts V4.2 旭日图(Sunburst)是ECharts 4.0新增的图表类型,由多层的环形图组成,在数据结构上,内圈是外圈的父节点。 因此,它既能像饼图一样表现局部和整体的占比,又能像矩形树图一样表现层级关系。 ## 树图 - 基于ECharts V4.2 树图是一种流行的利用包含关系表达层次化数据的可视化方法。 ## 地图数据可视化 - 基于ECharts Geo 地图热点、飞线动效,世界地图、中国地图、省份地图、城市地图、区县地图 ## 3D图表展示 - 基于ECharts GL 3D柱形图,3D地球,二维数据的3D化展示 ## 热力图展示 - 基于ECharts & 百度地图 基于百度地图的热力图,基于笛卡尔坐标系的热力图 ## ECharts扩展示例 词云,水球图,烟花秀,关系图谱,中国地图 ## 阿里云DataV案例 - 智慧文旅驾驶舱 基于阿里云DataV大屏制作工具,演示图表组件基本用法 ## 阿里云DataV案例 - 企业实时销售大盘 基于DataV行业模板快速生成,采用静态JSON数据 ## 百度Sugar案例 - 上交所上市公司全景概览 基于百度Sugar行业模板快速生成,采用远程数据源 ## 百度Sugar案例 - 深交所上市公司全景概览 以已有的大屏为模板快速创建,切换风格,更改数据源 ## 腾讯云图案例 - 云计算服务监控 基于腾讯云图平台提供的模板制作,采用静态JSON数据 ## 腾讯云图案例 - 智慧零售门店数据(竖屏版) 基于腾讯云图平台提供的模板制作,采用静态JSON数据,适用于竖屏展示 ## 大屏模板 可在这些不同风格的模板基础上快速开始一个可视化大屏项目

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

鱼月半

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值