echart折线图堆叠 y轴和实际数据不对应

简介: echart折线图堆叠 y轴和实际数据不对应

问题背景


最近在做前端echarts的折线图堆叠图标,发现问题是y轴的数据和后端接口返回的数据对应不上


48d5855bd6b5d4f3dbd161d07c6df228_7af4f7dd4e1445c28f404a6950e693e9.png


解决办法


方案1


查看了前端代码发现在echart的图表中有一个‘stack’的属性,尝试把他删除之后y轴的数据和后端提供的数据就保持一致了。


bbc72ad0d4a8416259d1c6bc3188f134_6b8a58f01fa844918d609f253e6929ef.png


方案2


把stack的属性值修改为不一样的属性值,比如:之前stack的属性值都为total,现在他他们的属性值设置为不一致的属性


904ed50253cf08aef49eacf6e200476f_907ec91d95294a598f564be513f64026.png


stack属性分析


stack属性会把同一个维度上的数据进行加和的处理,所以体现在y的数据就会基数变大。进而每一个小的节点也会变大。


所以只需要修改stack属性,把他删除或者修改属性值即可


相关文章
|
8月前
|
数据采集 人工智能 运维
从企业级 RAG 到 AI Assistant,阿里云Elasticsearch AI 搜索技术实践
本文介绍了阿里云 Elasticsearch 推出的创新型 AI 搜索方案。
711 5
解决echarts的叠堆折线图数据出现坐标和值对不上的问题
解决echarts的叠堆折线图数据出现坐标和值对不上的问题
365 0
|
监控 数据挖掘 BI
ERP系统中的成本管理与生产成本核算解析
【7月更文挑战第25天】 ERP系统中的成本管理与生产成本核算解析
1227 3
|
存储 前端开发
React路由跳转的几种方式
React路由跳转的几种方式
750 0
|
自然语言处理 JavaScript 前端开发
vue2 div滚动条下拉到底部时触发事件(懒加载) 超级简易版本的懒加载
vue2 div滚动条下拉到底部时触发事件(懒加载) 超级简易版本的懒加载
601 2
|
存储 Java C++
JVM内存模型和结构详解(五大模型图解)
JVM内存模型和结构详解(五大模型图解)
|
消息中间件 Java BI
RabbitMQ的四种消息传递模式与演示代码
RabbitMQ的四种消息传递模式与演示代码
406 0
el-select如何自定义下拉选项框的宽度
el-select如何自定义下拉选项框的宽度
2004 0
echarts去掉y轴线、设置x轴线的颜色、x轴文字颜色
echarts去掉y轴线、设置x轴线的颜色、x轴文字颜色
|
JavaScript Shell
electron使用child_process打开外部应用
electron使用child_process打开外部应用