关于echarts:echarts-移动端竖着显示

echarts在挪动端竖着显示（非竖屏切换）让用户看到更多的数据。

最终成果：

遇到的问题：

一、toolTip（文字）与y轴平行显示

看过官网文档后思路：
1、extraCssText配置属性（未解决）

extraCssText: 'transform:rotate(90deg) !important;transform-origin: center;',

2、formtter（未解决）

formatter() {  return `<h1>6</h1>`},

以上都不行，因为toolTip始终会动静计算地位并生成transform: translate3d(150px, 262px, 0px);

3、搞不定父元素，就搞定子元素（解决）

解决父元素必须思考两个问题：地位、旋转。
这是代码起码的解决方案。

配置项：

tooltip: {  trigger: 'axis',  className: 'tp-box',  position([left, top], params, dom, rect, size) {    return { left, top };  },},

css：

::v-deep(.tp-box ) {    background-color: transparent !important;    border: none;    box-shadow: none !important;    padding: 0 !important;    & > div {      transform: rotate(90deg) !important;      transform-origin: top left;      z-index: 9999999;      box-shadow: rgb(0 0 0 / 20%) 1px 2px 10px;      background-color: rgb(255, 255, 255);      border-width: 1px;      border-radius: 4px;      color: rgb(102, 102, 102);      padding: 10px;    }  }