526互联

echarts dataZoom 文本显示不完整

发布时间 2023-10-18 14:56:14作者: ZerlinM

显示不完整是这样的

预期结果是这样的

代码

dataZoom: [{
  show: true,
  xAxisIndex: [0, 1],
  type: "slider",
  top: "72%",
  // 文本换行是在这里处理
  // this.chartData.xdata[value] 的格式是这样的 "2022-02-23 00:00:00" 所以做如下处理
  labelFormatter: (value) => {
    return this.chartData.xdata[value].split(" ")[0] + '\n' + this.chartData.xdata[value].split(" ")[1]
  },
  start: 0,
  end: 100,
 }],