提示框组件可以设置在多种地方:
可以设置在全局,即 tooltip
可以设置在坐标系中,即 grid.tooltip、polar.tooltip、single.tooltip
可以设置在系列中,即 series.tooltip
可以设置在系列的每个数据项中,即 series.data.tooltip
mytextStyle = {
color: '#fff' //文字的颜色。
fontStyle: 'normal' //文字字体的风格; 可选:'normal','italic','oblique'
fontWeight: normal //文字字体的粗细; 可选:'normal','bold','bolder','lighter',100 | 200 | 300 | 400...
fontFamily: 'sans-serif' //文字的字体系列
fontSize: 14 //文字的字体大小
lineHeight number //行高。rich 中如果没有设置 lineHeight,则会取父层级的 lineHeight。
width: number, string //文字块的宽度。注意,文字块的 width 和 height 指定的是内容高宽,不包含 padding。
height: number, string //文字块的高度。
textBorderColor: 'transparent' //文字本身的描边颜色。
textBorderWidth: 0 //文字本身的描边宽度。
textShadowColor: 'transparent' //文字本身的阴影颜色。
textShadowBlur: 0 //文字本身的阴影长度。
textShadowOffsetX: 0 //文字本身的阴影 X 偏移。
textShadowOffsetY: 0 //文字本身的阴影 Y 偏移。
}
tooltip ={ //提示框组件
show:true, //是否显示提示框组件,包括提示框浮层和 axisPointer。
trigger: 'item', //触发类型,'item'数据项图形触发,主要在散点图,饼图等无类目轴的图表中使用。 'axis'坐标轴触发,主要在柱状图,折线图等 会使用类目轴的图表中使用。'none' 什么都不触发。
triggerOn:"mousemove", //提示框触发的条件,'mousemove'鼠标移动时触发。'click'鼠标点击时触发。'mousemove|click'同时鼠标移动和点击时触发。'none'不在 'mousemove' 或 'click' 时触发
showContent:true, //是否显示提示框浮层
alwaysShowContent:true, //是否永远显示提示框内容,默认情况下在移出可触发提示框区域后 一定时间 后隐藏,设置为 true 可以保证一直显示提示框内容
showDelay:0, //浮层显示的延迟,单位为 ms,在 triggerOn 为 'mousemove' 时有效
hideDelay:100, //浮层隐藏的延迟,单位为 ms
enterable:false, //鼠标是否可进入提示框浮层中,默认为false
renderMode: 'html' //浮层的渲染模式,默认以 'html 即额外的 DOM 节点展示 tooltip;此外还可以设置为 'richText' 表示以富文本的形式渲染,渲染的结果在图表对应的 Canvas 中(目前 SVG 尚未支持富文本),这对于一些没有 DOM 的环境(如微信小程序)有更好的支持。
confine:false, //是否将 tooltip 框限制在图表的区域内,当图表外层的 dom 被设置为 'overflow: hidden',或者移动端窄屏,导致 tooltip 超出外界被截断时,此配置比较有用
transitionDuration:0.4, //提示框浮层的移动动画过渡时间,单位是 s,设置为 0 的时候会紧跟着鼠标移动
position:['50%', '50%'], //提示框浮层的位置,默认不设置时位置会跟随鼠标的位置,Array[10%, 10%];回掉函数(function);inside鼠标所在图形的内部中心位置,top、left、bottom、right鼠标所在图形上侧,左侧,下侧,右侧,只在 trigger 为'item'的时候有效
formatter:"{b0}: {c0}
{b1}: {c1}", //提示框浮层内容格式器,支持字符串模板和回调函数两种形式,模板变量有 {a}, {b},{c},{d},{e},分别表示系列名,数据名,数据值等
backgroundColor:"transparent", //提示框浮层的背景色
borderColor:"#ccc", //提示框浮层的边框颜色
borderWidth:0, //提示框浮层的边框线宽
padding:5, //提示框浮层内边距,单位px 5 [5, 10] [5,10,5,10]
textStyle:mytextStyle, //提示框浮层文本样式
extraCssText: string //额外附加到浮层的 css 样式。为浮层添加阴影的示例:extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'
};
Function 回调函数,格式如下
(point: Array, params: Object|Array.