ECharts 解决双Y轴刻度不一致问题

概述

使用ECharts显示双Y轴时，因两轴对应数据最大、最小值不可能一直一样，故需要手动处理一下。按情景需要，大致分为3种情况。

情景一

• 若最大最小值固定，直接初始化设置option的yAxis的min和max属性值即可；
  假设已知固定最大最小值为0和1。

  var option =
      {
          ...
          yAxis:[
          {
              name: "",
              min: 0,
              max: 1,
          },
          {
              name: "",
              min: 0,
              max: 1,
          }],
                      ...
      };

  情景二

  若最大最小值不固定，而数据类型一致，即：双Y轴对应数据的数量级一致。添加一个JS处理函数即可。

  function set_data( arr_data )
  {
      var y_min = option.yAxis[0].min;
      var y_max = option.yAxis[0].max;        
      for( var n = 0; n < arr_data.length; n++ )
      {
              if( arr_data[ n ] > y_max )
                      y_max = arr_data[ n ];
              else if( arr_data[ n ] < y_min )
                      y_min = arr_data[ n ];
      }
      y_max = Math.ceil( y_max / 10 ) * 10;
      y_min = Math.floor( y_min / 10 ) * 10;
      option.yAxis[0].min = y_min;
      option.yAxis[0].max = y_max;
      option.yAxis[1].min = y_min;
      option.yAxis[1].max = y_max;
      myChart.setOption( option );
  }

  情景三

  若最大最小值不固定，而数据类型也不一致。

  
  

来源：oschina

链接：https://my.oschina.net/u/4274818/blog/4652862