Echarts图表中pie类型tooltip中formatter函数传递的参数从哪里来?

本文详细介绍了如何配置Echarts中的Tooltip提示框,并通过具体示例解释了formatter函数中参数的来源。针对数据展示需求,给出了实际使用的代码片段。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

最近参与一个项目遇到一个问题,这个tooltip提示框信息怎么配?找了好久最终配置成功,分享到这里大家共享一下,能节省不少时间

首先可以看一下系统介绍的文章,里面知识点比较多,也有注释,讲的很全,推荐大家看一下,Echart自定义Tooltip文章链接

这里我补充一点就是formatter函数中的param参数从哪里来?

直接上代码:下面的data中的数据就是params参数的来源。

tooltip: {
            trigger: 'item',
            formatter:function (parms){
              var str = parms.marker+""+ parms.data.name+"</br>"+
                "金额:"+ parms.data.value+"</br>"+
                "占比:"+ parms.percent+"%"+"</br>"+
                "笔数:"+ parms.data.count;
              return  str ;
            }
          },


series:[
    data:[
                {value: obj.nativeCity,
                  name: obj.nameList[0],
                  itemStyle:{color: "#ff6226"},
                  count:obj.nativeCityNum
                },
                {value: obj.nativeProvince,
                  name: obj.nameList[1],
                  itemStyle:{color:  "#2ca7f9"},
                  count:obj.nativeProvinceNum
                },
                {value: obj.otherProvince,
                  name: obj.nameList[2],
                  itemStyle:{color: "#2cc78f"},
                  count:obj.otherProvinceNum
                }
              ]
]

Over,问题解决。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值