Highcharts tooltip显示数量

今天用了菜鸟教程上的Highcharts饼图。
教程中对tooltip的设置如下


var tooltip = {  
     pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'  
};  

效果是鼠标悬停在饼图上时会显示 系列名称:百分比


  对Highcharts饼图加载数据时,可以直接加载数量值,饼图控件会自动将数量转换为百分比,同样通过point.percentage可以取值呈现。
在鼠标悬停查看占比详情时,除了百分比往往还希望看到实际数值,这一点教程没有提及,经过自己摸索可以通过如下方法实现


var tooltip = {  
     pointFormat: '数量:{point.y} <br/>占比:{point.percentage:.1f}%'  
};  

从加载数据的语句可以看出,y就是分析项的实际数值,因此可以通过point.y取到该值  

series= [{  
    data: [  
              {name: '项目1', y: 100 },     
              {name: '项目2', y: 59 }  
            ]  
}];


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值