近期用vue做項(xiàng)目挤渐，使用echarts圖表畫圖時励背，tooltip顯示內(nèi)容過多挨队，會導(dǎo)致tooltip超出圖表所在div平斩。
但是echarts tooltip應(yīng)用的是絕對定位恼策，且overflow屬性為hidden码倦。所以超出部分不會展示企孩。
搜索大家解決方案，有說tooltip配置項(xiàng)confine設(shè)置為true袁稽，但是現(xiàn)實(shí)內(nèi)容過多時勿璃，一樣顯示不全。所以一個完美的解決方案就是讓超出div的部分顯示出來推汽。
debug方式和解決方案分享出來补疑。
1.tooltip 的enterable屬性設(shè)置為true，讓鼠標(biāo)浮動時能進(jìn)入tooltip歹撒，查看其樣式莲组；
2.將這里position改為fixed，上級div的overflow屬性去掉暖夭，tooltip能超出div展示锹杈；
3.tooltip中position屬性支持回調(diào)函數(shù)顯示， position: function (point, params, dom, rect, size){}
? ? 其中point為鼠標(biāo)位置的二維數(shù)組
? ? dom為tooltip對應(yīng)的<div>顯示塊兒
? ? params是參數(shù)鳞尔，跟formatter回調(diào)函數(shù)的params一樣
則在該回調(diào)函數(shù)中嬉橙，設(shè)置dom的position屬性為fixed，返回position數(shù)組為
[鼠標(biāo)x軸位置? + 圖距離瀏覽器左側(cè)距離,鼠標(biāo)y軸位置? + 圖距瀏覽器上端距離 ]
類似代碼為:
顯示效果為：
