ECharts：如何显示所有轴标签？

Question

Echarts 似乎有一个不错的功能，可以根据提供的空间自动选择要显示的标签。然而，这个算法有时似乎有点过于激进，并且没有考虑文本旋转。我已经浏览了图表选项，似乎没有办法禁用此功能。我希望这只是我忽略的事情。感谢帮助。

Answer 1

axisLabel

（在

yAxis

或

xAxis

下）有一个选项

interval

。将其设置为

0

然后将显示标签。

Answer 2

你可以尝试这个来强制x轴的标签，

xAxis: {
      type: "category",
      data: data[0],
      axisLabel: {
        interval: 0,
        rotate: 30 //If the label names are too long you can manage this by rotating the label.
      }

//If your label is in the `y-axis` simply change the code `xAxis` to `yAxis`.

如果你的轴标签没有显示在图表框架中（意味着ECharts标签的长度太长），请尝试这个，

grid: { containLabel: true },

Answer 3

仅供记录：

如果你的类别有固定宽度，你也可以这样设置，以显示所有标签：

      axisLabel: {
        width: 100, //fixed number of pixels
        overflow: 'truncate', // or 'break' to continue in a new line
        interval: 0,
      },

Answer 4

解决长标签文本的2种方法

1. 使用旋转选项 xAxis : { axisLabel: { 旋转：45 } }
2. 使用格式化程序并引入“/n”来中断文本

Answer 5

你可以这样做：

  axisLabel: {
    hideOverlap: false, // This ensures labels are always shown
    interval: 0, // Forces all labels to show
    overflow: 'break', // Can be 'break' or 'truncate' depending on your preference
    // Optional: rotate labels if they overlap
    // rotate: 45,
    // Optional: adjust margins to prevent cutoffs
    margin: 15,
  },