V-charts坐标轴文字太长显示不全的问题

使用v-charts

<ve-histogram class="charts" :settings="chartSettings" :data="chartData" :extend="chartExtend" :grid="grid"></ve-histogram>

方案一： 旋转

chartExtend: {
// x轴字体斜显示
	xAxis: {
		axisLabel: {
			interval: 0, //
			rotate: 90 // 旋转的度数

                }
           }
},

• interval
  坐标轴刻度标签的显示间隔(在类目轴中有效哦)，默认会采用标签不重叠的方式显示标签（也就是默认会将部分文字显示不全）
  可以设置为0强制显示所有标签，如果设置为1，表示隔一个标签显示一个标签，如果为3，表示隔3个标签显示一个标签，以此类推
• rotate
  标签倾斜的角度，在类目轴的类目标签显示不全时可以通过旋转防止标签重叠（官方这样说的）旋转的角度是-90到90度。

方案二： 换行显示

上代码：

 chartExtend: {
        xAxis: {
          axisLabel: {
          interval: 0,
          //换行显示
          formatter: function(value) {
            let result = ""; //拼接加\n返回的类目项
            let maxLength = 4; //每项显示文字个数
            let valLength = value.length; //X轴类目项的文字个数
            let rowNumber = Math.ceil(valLength / maxLength); //类目项需要换行的行数
            if (rowNumber > 1) {
              //如果文字大于3,
              for (let i = 0; i < rowNumber; i++) {
                let temp = ""; //每次截取的字符串
                let start = i * maxLength; //开始截取的位置
                let end = start + maxLength; //结束截取的位置
                temp = value.substring(start, end) + "\n";
                result += temp; //拼接生成最终的字符串
              }
              return result
            } else {
              return value
            }
      }
},