【echarts】支持根据data中最大的数值来动态计算y轴最大数据以及间隔

以这个图例可以看到Y轴最大显示到250ml,如果超过就会出现有一部分数据看不到了:
https://echarts.apache.org/examples/zh/editor.html?c=mix-line-bar
在这里插入图片描述
那么如何根据这个data数据的最大值,来动态计算y轴最大数据以及间隔呢?

那我们就要从这里着手了,从官网得到,yAxis是y轴的声明,我们在这里面去修改y轴的属性即可
在这里插入图片描述

看图例,可以看到是固定了这个y轴的最大值250,最小值0,间隔是50
在这里插入图片描述
我们只需要把这个max改成按照data数据去计算即可:
在这里插入图片描述

	  min: 0,
      max: function(value) {
        // 以data中最大值+差值的0.2作为y轴最大值,这样会好看点,系数可以按照需要调整
        return Math.ceil(value.max + (value.max - value.min) * 0.2);
      },
      minInterval: 1,
        axisLabel: {
          interval: 'auto',
          formatter: function (value) {
            // 使用formatter保证即使在缩放时也只显示整数
            return Math.round(value);
        }
      },
  • 3
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值