#7139
HTML
<script type="text/javascript" src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/serial.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/themes/none.js"></script>
<div id="chartdiv"></div>
CSS
#chartdiv {
width : 100%;
height : 500px;
font-size : 11px;
}
JavaScript
var chart = AmCharts.makeChart("chartdiv", {
"type": "serial",
"theme": "none",
"dataProvider": [{
"country": "LDN",
"visits": 0
}, {
"country": "TIMC",
"visits": 0
}, {
"country": "Japan",
"visits": 0
}, {
"country": "Germany",
"visits": 0
}, {
"country": "UK",
"visits": 0
}, {
"country": "France",
"visits": 0
}, {
"country": "India",
"visits": 0
}, {
"country": "Spain",
"visits": 0
}, {
"country": "Netherlands",
"visits": 0
}, {
"country": "Russia",
"visits": 0
}, {
"country": "South Korea",
"visits": 0
}, {
"country": "Canada",
"visits": 0
}, {
"country": "Brazil",
"visits": 0
}],
"valueAxes": [{
"gridColor": "#FFFFFF",
"gridAlpha": 0.2,
"dashLength": 0
}],
"gridAboveGraphs": true,
"startDuration": 1,
"graphs": [{
"balloonText": "[[category]]: <b>[[value]]</b>",
"fillAlphas": 0.8,
"lineAlpha": 0.2,
"type": "column",
"valueField": "visits"
}],
"chartCursor": {
"categoryBalloonEnabled": false,
"cursorAlpha": 0,
"zoomable": false
},
"categoryField": "country",
"categoryAxis": {
"gridPosition": "start",
"gridAlpha": 0
},
"exportConfig": {
"menuTop": 0,
"menuItems": [{
"icon": '/lib/3/images/export.png',
"format": 'png'
}]
}
});
// Loop to generate the buttons
for (i in chart.dataProvider) {
var item = chart.dataProvider[i];
var btn = document.createElement('button');
btn.country = item.country;
btn.innerHTML = item.country;
btn.onclick =...