highcharts饼图及点击事件
highcharts是一个javascript图表库,支持曲线图、柱状图、饼图、散点图等。具体的demo可查看官方网站:highcharts示例 使用之前肯定要引入相应的js文件,以3d饼图为例,需要引用highcharts.js和highcharts-3d.js,两个文件可到官网下载。参数div为饼图在html中的容器的id,pieTitle和pieSubTitle为饼
·
highcharts是一个javascript图表库,支持曲线图、柱状图、饼图、散点图等。具体的demo可查看官方网站:highcharts示例
pieSeriesData = new Array();.push(new Array(key,value));
function pieChart(div) {
Highcharts.chart(div, {
chart: {
type: 'pie',
options3d: {
enabled: true,
alpha: 45
}
},
title: {
text: pieTitle
},
subtitle: {
text: pieSubTitle
},
plotOptions: {
pie: {
innerSize: 100,
depth: 45,
events: {
click: function (e) {pieClick(e.point.name);}
}
}
},
series: [{
name: pieSeriesName,
data: pieSeriesData
}]
});
}
饼图的点击事件
function pieClick(name){
//name为所点击的饼图区域的key值,即pieSeriesData中配置的数据源中的key,可根据key值进行相关操作。
}
效果图如下:
更多推荐
已为社区贡献2条内容
所有评论(0)