EChart的tooltip formatter

tooltip是游标指到图表时,会出现的提示框,内容大抵上是某某资料的值是多少这样。而formatter就是这些资讯要以什么样的型式来呈现。

两种设定方法:

string template
直接使用eChart做好的template string,很方便,但能调整的弹性低,比如说这样的悲剧...(为保护受害者,以下部分资讯已打码)
callback function
callback里第一个自带的argument里有我们想要的东西,先印出来看看里面怎么写
 tooltip: {      trigger: "item",      formatter: function (params) {        console.log('formatter params');      },    },


其实这在文件中都有列,但没实际例子有点难联想

比较常用的有:

maker: 标示legend的点点name: 数据名称data: 数据值percent: pie chart的百分比

formatter需要吃字串,所以在callback里回传一个由你想要的资讯所组合而来的字串就可以

formatter: function (params) {        return `${params.seriesName} <br/>${params.marker}${params.name}: ${params.data["eventCount"]} (${params.percent}%)`;      },

这样就成功了!其实并不难


关于作者: 网站小编

码农网专注IT技术教程资源分享平台,学习资源下载网站,58码农网包含计算机技术、网站程序源码下载、编程技术论坛、互联网资源下载等产品服务,提供原创、优质、完整内容的专业码农交流分享平台。

热门文章