在使用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' } } }
echarts 多组数据在同一坐标轴显示 toolTips 自定义
猜你喜欢
转载自blog.csdn.net/Mr_carry/article/details/103011356
今日推荐
周排行