轻松完美-实现ECharts双Y轴左右刻度线一致

时间:2024-04-05 16:13:37

不一致的情况如下图:

轻松完美-实现ECharts双Y轴左右刻度线一致

修改成一致的情况如下图:

轻松完美-实现ECharts双Y轴左右刻度线一致

代码如下:

yAxis : [
                    {
                        type : 'value',
                        name : '人数',
                        //splitLine:{show:false},
                        axisLabel : {
                            formatter: '{value} 个',
                            textStyle:{color: '#A23400'}//#A23400 purple
                        },
                        axisLine:{
                              lineStyle:{color:'#A23400',width:'1'}  //y轴坐标轴颜色  #A23400 black
                        }
                    },
                    {
                        type : 'value',
                        name : '人次',
                        //splitLine:{show:false},
                        axisLabel : {
                            formatter: qfamtter,
                            textStyle:{color: '#00AEAE'}//#00AEAE blue
                        },
                        axisLine:{
                              lineStyle:{color:'#00AEAE',width:'1'}  //y轴坐标轴颜色 #00AEAE black
                        },
                        min: 0,
                        max: Max2*2,
                        splitNumber: 6,
                        interval: (Max2*2 - 0) / 6
                    }

其中需要加:

,
                        min: 0,
                        max: Max2*2,
                        splitNumber: 6,
                        interval: (Max2*2 - 0) / 6

左边Y轴默认了分成6段,所以要把右边Y轴也分成6段。

附加:jquery 数组获取最大值和最值的方法,仅供参考

//计算最大值
  function cal_Max(a) {
        //debugger
        a=$.grep(a,function(n,i){return i>0;});
        var maxval = Math.max.apply(null, a);
        return maxval;
      }
 
  //计算最小值
  function calMin(a) {
    a=$.grep(a,function(n,i){return i>0;});
    var minval = Math.min.apply(null, a)
    return minval;
  }