echarts 图表解决Y轴刻度在某些情况下不为整数问题

简介: echarts 图表解决Y轴刻度在某些情况下不为整数问题

1:问题描述

当我们开发中,用echarts 图表展示数据的时候,当数据为 0 时,echarts 图表会默认将Y 轴刻度进行等分,这个时候如果 我Y轴要显示的是任务数量,种类数量,就会出现小数,例:0.2,0.4 这种,这种显然是不合理的。

问题

1ddd1b50630346f9ac999346d6ffbbcc.png

2:解决方法

    // 解决Y轴整数刻度
  var maxCount = '5';
  var newdata = series[0].data;
  var count = Math.max(...newdata);
  if (count == 0) {
    yAxis[0].max = maxCount;
  }
    if(count <= 5){
        yAxis[0].max = maxCount;
    }

3:效果

7b14fee597b54c71a79cd13629f4920f.png

目录
相关文章
|
2天前
|
数据可视化 JavaScript 前端开发
Echarts是一个开源的JavaScript可视化库,用于创建各种类型的图表
Echarts是JavaScript的开源可视化库,Python通过Pyecharts库可调用它来绘制图表。示例展示了如何用Pyecharts创建柱状图:定义图表对象,设置标题和坐标轴,添加X轴、Y轴数据,最后渲染展示。Pyecharts还支持折线图、散点图、饼图等多种图表类型,更多详情可查阅官方文档。
32 0
|
2天前
|
前端开发 JavaScript 定位技术
Docusaurus框架——react+antd+echarts自定义mdx生成图表代码解释文档
Docusaurus框架——react+antd+echarts自定义mdx生成图表代码解释文档
28 0
|
2天前
|
存储
vue2、vue3分别配置echarts多图表的同步缩放(二)
vue2、vue3分别配置echarts多图表的同步缩放
20 0
|
2天前
|
API
vue2、vue3分别配置echarts多图表的同步缩放(一)
vue2、vue3分别配置echarts多图表的同步缩放
17 0
|
2天前
|
容器
echarts图表怎样实现刷新功能?
echarts图表怎样实现刷新功能?
|
2天前
|
JavaScript
如何在vue添加echarts图表
如何在vue添加echarts图表
17 0
|
2天前
|
SQL JavaScript 分布式数据库
使用Vue+ ECharts进行动态图表展示
Vue是一个用于构建用户界面的渐进式JavaScript框架,可以轻松构建单页面应用程序(SPA)。ECharts是一个基于JavaScript的数据可视化库,可以通过简单的配置实现各种图表的展示和交互。
101 0
|
2天前
Echarts图表设置x轴y轴均随滚轮滚动缩+放 区域缩放
Echarts图表设置x轴y轴均随滚轮滚动缩+放 区域缩放
|
2天前
|
JavaScript
Vue引入Echarts图表的使用
Vue引入Echarts图表的使用