在使用echarts的时候会遇到多组数据,或是柱状图,或是折线图一起显示在一个坐标系中,这时候你会发现鼠标hover的时候只会显示一组数据,这时候就需要自定义,取出鼠标hover中的param。然后打印出来看看,发现里面包含了所有的数据,哎,那就好办了。特此记录下。不懂可以问,或者在线解答,博客太难写了:
tooltip: {
trigger: 'axis',
formatter:function (param) {
let str = "";
let dada = 0;
for (let i=param.length-1; i>=0; i--){
if (param[i].seriesName === '实测人数'){
dada = param[i].data;
param[i].marker = "<span style=\"display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:rgba(0,255,255,1);\"></span>";
}
if (param[i].seriesName === '完成率'){
param[i].data = param[i].data+"%";
param[i].marker = "<span style=\"display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#ffffff; border: 1px solid rgba(0,255,255,1);\"></span>";
}
if (param[i].seriesName === '未测人数'){
param[i].data = param[i].data - dada
}
str = str + param[i].marker+param[i].seriesName+":"+param[i].data+'<br>';
}
return str
},
axisPointer: {
type: 'cross',
crossStyle: {
color: '#999'
}
}
}
版权声明:本文为Mr_carry原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。