通过jQuery或者js制作amcharts(AmCharts)图表如何给每个柱状图添加链接或者点击事件,感觉很难做,谢谢大家

百度账户不忍被抛弃 百度账户不忍被抛弃 墨衍会员 · AI 创作全网分发 墨衍智能分发 通过墨衍一键同步至各平台 可同步平台 CSDN微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年,写一次发全网 我也要 + 加入社区
系统能正常运行。

我的图表是这样的:


页面引用:


js代码:
单位:亿元
<div id="chartdiv" style="height: 350px;"></div>
<div id="taxNO">333</div>

<script type="text/javascript">
var chart;
var yiyue = $("#taxNO").text();
var chartData = [{
"country": "一月",
"visits": yiyue,
"color": "#FF0F00"

}, {
"country": "二月",
"visits": 188,
"color": "#FF6600"
}, {
"country": "三月",
"visits": 180,
"color": "#FF9E01"
}, {
"country": "四月",
"visits": 132,
"color": "#FCD202"
}, {
"country": "五月",
"visits": 112,
"color": "#F8FF01"
}, {
"country": "六月",
"visits": 111,
"color": "#B0DE09"
}, {
"country": "七月",
"visits": 98,
"color": "#04D215"
}, {
"country": "八月",
"visits": 71,
"color": "#0D8ECF"
}, {
"country": "九月",
"visits": 66,
"color": "#0D52D1"
}, {
"country": "十月",
"visits": 50,
"color": "#2A0CD0"
}, {
"country": "十一月",
"visits": 44,
"color": "#8A0CCF"
}, {
"country": "十二月",
"visits": 44,
"color": "#CD0D74"
}];


var chart = AmCharts.makeChart("chartdiv", {
type: "serial",
dataProvider: chartData,
categoryField: "country",
depth3D: 20,//3D效果的厚度
angle: 30,//3D效果的倾斜度

categoryAxis: {
labelRotation: 10,//月份显示宽度
gridPosition: "start"
},

valueAxes: [{
title: "",
}],

graphs: [{

valueField: "visits",
colorField: "color",
type: "column",
lineAlpha: 0,
fillAlphas: 1
}],

chartCursor: {
cursorAlpha: 0,
zoomable: false,
categoryBalloonEnabled: false
},

exportConfig: {
menuTop: "21px",
menuBottom: "auto",
menuRight: "21px",
backgroundColor: "#efefef",

menuItemStyle: {
backgroundColor: '#EFEFEF',
rollOverBackgroundColor: '#DDDDDD'
},

menuItems: [{
textAlign: 'center',
icon: '../amcharts/images/export.png',
onclick: function () { },
items: [{
title: 'JPG',
format: 'jpg'
}, {
title: 'PNG',
format: 'png'
}, {
title: 'SVG',
format: 'svg'
}, {
title: 'PDF',
format: 'pdf'
}]
}]
}
});
</script>
...全文
评论 4
收藏 已收藏
分享
返回顶部