echats 的 xAxis 字体放不下 interval 自动省略、

ECharts 是一个使用 JavaScript 实现的开源可视化库，它可以在网页中创建丰富的图表。当你在使用 ECharts 的时候，可能会遇到 x 轴标签文字过长，导致显示不下的情况。ECharts 提供了 `xAxis.interval` 属性来控制 x 轴标签的显示间隔，但当标签文字本身很长时，仅靠 `interval` 属性可能无法完全解决问题。

如果标签文字过长，可以采取以下几种方法来优化显示效果：

1. **自动省略**：通过设置 `axisLabel` 属性中的 `interval` 为 0，让 ECharts 自动决定如何省略文字以适应显示空间。

2. **文字旋转**：如果 x 轴标签过宽，可以尝试将标签旋转一定角度（比如90度），以减少宽度的占用。

3. **文字截断**：使用 `axisLabel.formatter` 回调函数，可以对每个标签进行自定义格式化。你可以在这个函数中对标签文本进行截断处理，以适应显示空间。

4. **省略号显示**：在 `axisLabel.formatter` 回调函数中，可以在文本超出部分加上省略号（...）来提示用户完整内容被省略。

下面是一个简单的示例代码，展示了如何在 ECharts 中使用 `axisLabel.formatter` 实现标签文本的自定义格式化：

option = {
    xAxis: {
        type: 'category',
        data: ['长文本标签1', '长文本标签2', '长文本标签3', '长文本标签4'],
        axisLabel: {
            interval: 0, // 开启自动省略
            formatter: function (params) {
                // 如果文本长度超过10个字符，则显示为前7个字符加上省略号
                if (params.value.length > 10) {
                    return params.value.substring(0, 7) + '...';
                }
                return params.value;
            }
        }
    },
    // ... 其他配置项
};