ECharts Y轴文字一行一个字排布：详细教程

要实现 ECharts 中 y 轴文字一行一个字排布，可以通过设置 y 轴的 axisLabel 属性中的 formatter 属性来实现。具体步骤如下：

首先，需要在 ECharts 中引入合适的版本，确保可以使用 axisLabel 属性。可以通过以下方式引入 ECharts：

<script src='https://cdn.jsdelivr.net/npm/echarts@5.2.0/dist/echarts.min.js'></script>

在 JavaScript 代码中，定义 y 轴的配置项，包括 axisLabel 的 formatter 属性。可以使用一个函数来实现文字一行一个字排布的效果，示例代码如下：

var option = {
  yAxis: {
    type: 'category',
    axisLabel: {
      formatter: function (value) {
        return value.split('').join('
');
      }
    },
    data: ['文字1', '文字2', '文字3'] // 替换为实际的 y 轴数据
  },
  // 其他配置项...
};

在上述代码中，formatter 函数首先通过 split 方法将字符串拆分成单个字符的数组，然后使用 join 方法将数组中的元素用换行符 '\n' 连接起来，从而实现一行一个字的效果。

最后，将配置项应用到 ECharts 实例中，并渲染图表：

var chart = echarts.init(document.getElementById('chart')); // 替换为实际的图表容器 ID
chart.setOption(option);

以上代码将使用 id 为'chart' 的 HTML 元素作为图表的容器，可以根据实际情况进行调整。

通过以上步骤，就可以实现 ECharts 中 y 轴文字一行一个字排布的效果。