echarts tooltip位置实现垂直方向固定,水平方向可以自由移动

lilisong0523
  • 279

如下代码

tooltip: {
                        trigger: 'axis',
                        textStyle: {
                            color: contentColor
                        },
                        axisPointer: { 
                            type: 'shadow' 
                        },
                        position: function(point, params, dom) {
                            return [point[0], '10%'];
                        }

                    },

这个代码可以实现tooltip在垂直上是固定的,但是只能出现在鼠标右侧,要是鼠标移动到右侧item那么tooltip就被遮挡了.
请问怎么实现垂直上是固定,水平上是auto?

回复
阅读 7.3k
2 个回答
 position: function(point, params, dom) { 
                    var posDis = window.innerWidth - dom.offsetWidth; 
                    return posDis<point[0]?[posDis, '10%']:[point[0], '10%'];

                },
好久不说ltns
  • 2
新手上路,请多包涵
position: function (pos, params, dom, rect, size) {
  let yPos = '20%'
  let xPos = 0
  if (pos[0] < size.viewSize[0] / 2) {
    xPos = pos[0] + 10
  } else {
    xPos = pos[0] - dom.offsetWidth - 10
  }
  return [xPos, yPos]
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏