记录echarts tooltip过长被截断的解决方式
tooltip: { trigger: 'axis', show: true, confine: true, extraCssText: 'z-index: 2;', appendToBody: true, // 将 tooltip 的 DOM 节点添加为 HTML 的 <body> 的子节点 }
弹框展示不完整,加confine:true无效
tooltip有一个extraCssText属性,可以修改弹框样式 : extraCssText: ‘z-index: 2;’ 依然无效
重点: appendToBody 官方文档
是否将 tooltip 的 DOM 节点添加为 HTML 的 的子节点
默认值是 false。false 表示,tooltip 的 DOM 节点会被添加为本图表的 DOM container 的一个子孙节点。但是这种方式导致,如果本图表的 DOM container 的祖先节点有设置 overflow: hidden,那么当 tooltip 超出 container 范围使可能被截断。这个问题一定程度上可以用 tooltip.confine 来解决,但是不一定能解决所有场景
最终效果: