如何在ECharts散点图中居中显示Y轴标签？

要让ECharts散点图的Y轴标签（轴名称）与轴线居中对齐，只需修改Y轴的配置项即可，具体操作如下：

核心配置调整 #

在yAxis配置中添加以下关键参数：

• nameLocation: 'center'：将标签位置设置为轴线的中间位置，这是实现居中对齐的核心。
• nameGap：调整标签与轴线的间距，根据图表实际尺寸和标签长度微调数值，确保对齐效果。
• 可选nameRotate: 0：默认Y轴标签为垂直旋转状态，若需水平显示标签，设置此参数为0即可。

完整示例配置 #

option = {
  xAxis: {
    type: 'value',
    boundaryGap: false
  },
  yAxis: {
    type: 'value',
    name: 'Y轴标签',
    nameLocation: 'center',
    nameGap: 40, // 可根据实际情况修改
    nameRotate: 0, // 可选，按需开启
    axisLine: {
      show: true
    }
  },
  series: [
    {
      type: 'scatter',
      data: [[10.0, 8.04], [8.07, 6.95], [13.0, 7.58], [9.05, 8.81], [11.0, 8.33], [14.0, 7.66], [13.4, 6.81], [10.0, 6.33], [14.0, 8.96], [12.5, 6.82], [9.15, 7.20], [11.5, 7.20], [3.03, 4.23], [12.2, 7.83], [2.02, 4.47], [1.05, 3.33], [4.05, 4.96], [6.03, 7.24], [12.0, 6.26], [12.0, 8.84], [7.08, 5.82], [5.02, 5.68]]
    }
  ]
};

补充说明 #

• 调整nameGap数值时，可根据图表大小和标签长度逐步测试，直到标签与轴线完全居中对齐。
• 若不需要水平显示标签，可移除nameRotate配置，保留默认垂直旋转状态，配合nameLocation: 'center'同样能实现垂直方向的居中对齐。

内容的提问来源于stack exchange，提问作者Niye