1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > echarts中的自定义tooltips

echarts中的自定义tooltips

时间:2020-08-03 04:57:42

相关推荐

echarts中的自定义tooltips

百度的echarts其实已经很强大了,直接配置项中的tooltip.formatter 就可以设置,

模板变量有 {a}, {b},{c},{d},{e},分别表示系列名,数据名,数据值等。 在 trigger 为 ‘axis’ 的时候,会有多个系列的数据,此时可以通过 {a0}, {a1}, {a2} 这种后面加索引的方式表示系列的索引。 不同图表类型下的 {a},{b},{c},{d} 含义不一样。 其中变量{a}, {b}, {c}, {d}在不同图表类型下代表数据含义为:

折线(区域)图、柱状(条形)图、K线图 : {a}(系列名称),{b}(类目值),{c}(数值), {d}(无)

散点图(气泡)图 : {a}(系列名称),{b}(数据名称),{c}(数值数组), {d}(无)

地图 : {a}(系列名称),{b}(区域名称),{c}(合并数值), {d}(无)

饼图、仪表盘、漏斗图: {a}(系列名称),{b}(数据项名称),{c}(数值), {d}(百分比)

更多其它图表模板变量的含义可以见相应的图表的 label.formatter 配置项。

formatter: '{b0}: {c0}<br />{b1}: {c1}'

但是这个满足不了项目的要求,项目要求在地图上每个点都显示自己的日志信息,这就用到配置项手册的回调函数了,

回调函数传递的第一个值 params 是 formatter 需要的数据集

formatter: function(params) {var datas = option.series[0].data;var res = '城市名:'+params['name']+'<br/>号码:'+result['number'];for (var i = 0; i < datas.length; i++) {if(params['name'] == datas[i].name){res = res + '<br/>UUID:'+datas[i].user_uuid;break;}}return res;}

由于种种要求只能粘贴部分代码 ,起始也就是一句话formatter用function,根据name从自己option里找到你要的数据拼接html片段返回

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。