tooltip: {
  //......
    formatter: function (params: any) {
      setTimeout(() => {
        const root = document.getElementById('tool-tip')
        if(root) {
          ReactDOM.render(
            <div>{ params.data.name } : { params.data.value } </div>,
            root
          )
        }
      }, 0)
      return '<div id="tool-tip"></div>'
    }
  },
// ...

原理很簡單，就是調(diào)用ReactDOM.render去渲染jsx，這里稍微要注意下獲取root的時機，因為只有formatter被echarts調(diào)用后才會被渲染，所以我們將react的渲染時機放在了下一個宏任務中，這樣就能確?？梢垣@取到root元素。

這個方法并不能保證react或者echarts的所有特性都能實現(xiàn)：

1. 比如設置tooltip位置，不能用position回調(diào)，因為這里用了setTimeout來渲染節(jié)點，所以在position回調(diào)里面無法獲取到渲染后的dom寬高， 當然可以提前寫死。
   我的解決方法是用css定位
   比如這樣

  transform: translate(-55%, -170%);