个人工作记录
1.工作中遇到的问题描述:饼状图鼠标悬浮时,提示文字超出画布,如图:
通过tooltip的confine属性解决,官网的介绍:
confine:是否将 tooltip 框限制在图表的区域内。
当图表外层的 dom 被设置为 'overflow: hidden'
,或者移动端窄屏,导致 tooltip 超出外界被截断时,此配置比较有用。
tooltip: { confine: true },
2.tooptip其他常用功能
tooltip: { show: true,//是否显示提示框 trigger: 'item',//可选,饼图、散点图用item,柱状图、折线图用axis,none什么都不触发 showContent: true,// enterable: true,//鼠标是否可进入提示框浮层中,默认为false,如需详情内交互,如添加链接,按钮,可设置为 true。 confine: true,//是否将 tooltip 框限制在图表的区域内。当图表外层的 dom 被设置为 'overflow: hidden',或者移动端窄屏,导致 tooltip 超出外界被截断时,此配置比较有用。 formatter: '{a}<br/>{b}:{c} {d}%',//提示框浮层内容格式器,支持字符串模板和回调函数两种形式。 textStyle: {//提示框内文字样式的设置 color:'red', fontSize:'18' } },