Apache Echarts图表标题能否旋转为左侧垂直显示？

Echarts原生的title组件确实没有直接的旋转配置，但可以通过以下两种方法实现侧边垂直标题的需求：

方法一：使用graphic组件自定义标题（推荐） #

graphic组件支持自由绘制图形和文本，能精准控制标题的位置、旋转角度和样式，完全适配侧边垂直排列的需求：

option = {
  // 自定义垂直侧边标题
  graphic: [{
    type: 'text',
    left: 15, // 距离左侧的距离
    top: 'center', // 垂直居中
    style: {
      text: '月度销售数据',
      fontSize: 16,
      fontWeight: 'bold',
      rotate: 270, // 旋转270度，实现图书馆书脊式的阅读方向（文字从下到上）
      fill: '#333'
    }
  }],
  // 常规图表配置
  xAxis: {
    type: 'category',
    data: ['1月', '2月', '3月', '4月', '5月']
  },
  yAxis: {
    type: 'value'
  },
  series: [{
    data: [120, 200, 150, 80, 220],
    type: 'bar'
  }]
};

如果需要文字从上到下排列，只需将rotate值改为90即可。

方法二：通过CSS强制旋转原生title组件 #

这种方法依赖Echarts生成的DOM结构，版本更新可能导致失效，仅作为备选方案：

/* 假设Echarts容器的id为main */
#main .echarts-title {
  writing-mode: vertical-rl; /* 垂直排版 */
  text-orientation: upright; /* 文字直立显示 */
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
}

使用时需要调整原生title的默认布局（比如设置title.left为负数，避免占用顶部空间）。

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