解决echarts中的X轴中文字过长显示不全

方法1：通过倾斜文字达到显示完全，配置X轴的label的rotate的倾斜角度达到效果

效果：

 

 但是方法1的弊端是：无法解决设置倾斜角度后仍然无法显示全，并且会往下延申的文字会占据echarts图的空间，会挤压上部的空间。

 

方法2：对倾斜的文字设置换行，可以解决方法1带来的弊端

axisLabel: {
              interval: 0,
              rotate: -60,
              formatter: function (value) {
                console.log(value, 'value')
                var ret = '\n\n' //拼接加 返回的类目项
                var maxLength = 6 //每项显示文字个数
                var valLength = value.length //X轴类目项的文字个数
                var rowN = Math.ceil(valLength / maxLength) //类目项需要换行的行数
                if (rowN > 1) {
                  //如果类目项的文字大于6,
                  for (var i = 0; i < rowN; i++) {
                    var temp = '' //每次截取的字符串
                    var start = i * maxLength //开始截取的位置
                    var end = start + maxLength //结束截取的位置
                    //这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
                    temp = value.substring(start, end) + '\n'
                    ret += temp //凭借最终的字符串
                  }
                  return ret
                } else {
                  return value
                }
              },
              color: '#fff'
            }