echarts中x轴、y轴 类目自定义换行

在echarts中可能因为某项的名字过长想要换行展示,就可以在 axisLabel 属性中自定义换行,

如以下案例在y轴上换行展示()

yAxis:[

   axisLabel: {

         formatter: function(value) {

                var ret = ''   // 拼接加 \n 返回的类目项

                var maxLength = 6  // 每项显示文字个数

                var valLength = value.length   // Y轴类目项的文字个数

                var rowNum = Math.ceil(valLength / maxLength)   // 类目项需要换行的行数

                if (rowNum> 1) { // 如果类目项的文字大于3,

                  for (var i = 0; i < rowNum; i++) {

                    var temp = ' '// 每次截取的字符串

                    var start = i * maxLength// 开始截取的位置

                    var end = start + maxLength// 结束截取的位置

                    // 这里也可以加一个是否是最后一行的判断,但是不加也没有影响

                    temp = value.substring(start, end) + '\n'

                    ret += temp // 最终的字符串

                  }

                  return ret

                } else {

                  return value

                }

              }

            },

]

你可能感兴趣的:(echarts,前端,javascript)