tooltip:{
trigger:"axis",
axisPointer:{
type:"shadow"
},
formatter:function(params){
var str = params[0].name+"<br>";
var total=0;
var total1=0;
params.forEach(function(item){
let value=Number(item.value)
str+=item.marker+""+item.seriesName+":"item.value+"<br> "
if (item.componentSubType=="bar"){
total=tools.add(total,item.value);
}
if (item.componentSubType=="bar" && iten.seriesName=="大"){
total1=tools.add(total1,item.data);
}
if (item.componentSubType=="bar" && iten.seriesName=="小"){
total1=tools.add(total1,item.data);
}
})
str+='<span style="diaplay:inline-block;margin-right:5px;border-
radius:10px;width:10px;height:10px;bockground-color:#BE77FF"></span>'+'总计:'+total
+"<br>"
str+='<span style="diaplay:inline-block;margin-right:5px;border-
radius:10px;width:10px;height:10px;bockground-color:#BE77FF"></span>'+'大小合计:'+total1
+"<br>"
return str;
}
}
注意:使用这段代码需要提前引入add工具import tools from "@utils/tools"
echarts中的浮窗计算总和以及任意两个之和
最新推荐文章于 2023-07-27 09:28:05 发布
本文介绍了一个JavaScript代码片段,用于创建图表tooltip,通过axis触发器实时显示数据。它展示了如何计算每个条形图的总和,并区分大小类别。重点在于formatter函数,展示了如何将组件子类型、系列名称和值组合成易读的tooltip信息。
摘要由CSDN通过智能技术生成