解决echarts 图表tooltip 中内容过多过长引起的展示不全的问题

1. 核心思路是：由于tooltip的内容过多以至于canvas区域不能放下，因此我们需要改变tooltip的dom的定位方式为fixed。

2. 关键点在于：设置echarts的tooltip.position 。并准确计算tooltip的position 的 left 和 top。

3. 代码部分。详细内容请看代码中的注释部分。

position: function(point, e, dom, size) {
    // 1.计算出绘制canvas的容器（dom.parentNode的值）相对于页面顶部的高度。注意需要由相对于浏览器窗口上部的距离 加上 页面卷曲的高度 来计算。
    var top = dom.parentNode.getBoundingClientRect().top + (window.scrollY ? window.scrollY : window.pageYOffset)
    // 2.计算出canvas外容器相对与浏览器窗口的左侧的距离
    var left = dom.parentNode.getBoundingClientRect().left
    // 3.因为tooltip内容过多，canvas已经放不下tooltip。所以需要改变tooltip的定位方式为fixed。
    dom.style.position = 'fixed'
    // 4.计算出left
    var resultLeft = point[0] + left + 5 + dom.clientWidth > document.body.clientWidth ? document.body.clientWidth - dom.clientWidth - 20 : point[0] + left + 5
    // 5.计算出top
    var resultTop = (point[1] + top + dom.clientHeight) < document.body.clientHeight ? point[1] + dom.parentNode.getBoundingClientRect().top : dom.parentNode.getBoundingClientRect().top - dom.clientHeight + point[1]
    // 6.返回位置数据 [left, top]
    return [resultLeft, resultTop]
},

4. 如有问题欢迎评论区留言沟通