highcharts双柱形图ID点击事件

Highcharts.chart('container',{
	chart: {
		type: 'column'
	},
	title: {
		text: '用户'
	},
	xAxis: {
		categories: ['a','b'],
		crosshair: true
	},
	yAxis: {
		min: 0,
		title: {
			text: ' '
		}
	},
	tooltip: {
		// head + 每个 point + footer 拼接成完整的 table
		headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
		pointFormat: '<tr><td style="color:{series.color};padding:0">人数: </td>' +
		'<td style="padding:0"><b>{point.y} 人</b></td></tr>',
		footerFormat: '</table>',
		shared: true,
		useHTML: true
	},
	plotOptions: {
		column: {
			borderWidth: 0
		},
		series: {
			cursor: 'pointer',
			point: {
				events: {
					click: function (e) {
						console.log('id:'+this.id)
						console.log('status:'+this.status)
					}
				}
			}
		}
	},
	series: [{
		name:'人数1',
		data: [{id:1,name:'a',y:18,status:1},{id:2,name:'b',y:18,status:1}],
		dataLabels: {
			enabled: true
		}
	},{
		name:'人数2',
		data: [{id:1,name:'a',y:10,status:0},{id:2,name:'b',y:10,status:0}],
		dataLabels: {
			enabled: true
		}
	}]
});

 在线预览链接:https://jshare.com.cn/temp/RSZx0q/1

转载于:https://www.cnblogs.com/phper8/p/9954352.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值