解决echarts纵坐标数字太长，导致遮挡的问题

 

数字位数过多时，在小屏手机会出现数字显示不全，被遮挡的问题。此处记录下，在摸索下有两种办法解决这个问题。

1.改变距离左边的距离

这种办法，可用于处理数字位数不太多，经过测试，八位数一下都可以使用这种办法，八位数以上，会影响整体布局，出现曲线显示较少的问题。

 grid: {
        left: '18%',}

2.使用科学计数法

这种方法可以用来处理位数过多的问题，缺点就是数字不够直观。

yAxis: {
                type: 'value',
                // 科学记数法
                axisLabel: {
                    formatter: function (value) {
                        if (Math.abs(value) > 100000) {
                            if (value == 0) {
                                return "0";
                            } else if ((value + '').indexOf('e') > 0) {
                                return (value + '').replace(/e/, "E");
                            } else {
                                var res = value.toString();
                                var numN1 = 0;
                                var numN2 = 0;
                                var num1 = 0;
                                var num2 = 0;
                                var t1 = 1;

                                for (var k = 0; k < res.length; k++) {
                                    if (res[k] == ".")
                                        t1 = 0;
                                    if (t1)
                                        num1++;
                                    else
                                        num2++;
                                }

                                // 均转换为科学计数法表示

                                if (Math.abs(value) < 1) {
                                    // 小数点后一位开始计算
                                    for (var i = 2; i < res.length; i++) {
                                        if (res[i] == "0") {
                                            numN2++; //记录10的负指数值（默认值从1开始）
                                        } else if (res[i] == ".")
                                            continue;
                                        else
                                            break;
                                    }

                                    var v = parseFloat(value);
                                    v = v * Math.pow(10, numN2);
                                    v = v.toFixed(1); //四舍五入 仅保留一位小数位数
                                    return v.toString() + "e-" + numN2;
                                } else if (num1 > 1) {
                                    numN1 = num1 - 1;
                                    var v = parseFloat(value);
                                    v = v / Math.pow(10, numN1);
                                    if (num2 > 1) {
                                        v = v.toFixed(1);
                                    }
                                    return v.toString() + "e" + numN1;
                                }

                            }
                        } else {
                            return value;
                        }
                    }
                }
            },

3.文字倾斜

yAxis: {
       
        axisLabel: {
          interval: 0,
          rotate: 45,
        }
          
      },