Dynamically changing the color of the slice on pie chart
by sameer vedpathak
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/pie.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/themes/none.js"></script>
<div id="chartdiv"></div>
<input type="button" value="color slice #3" id="button" onclick="test();" />
CSS
body {
font-family: Verdana;
font-size: 12px;
}
#chartdiv {
width : 100%;
height : 500px;
font-size : 11px;
}
#button {
font-size: 15px;
padding: 10px;
position: absolute;
top: 30px;
right: 30px;
}
JavaScript
var chart = AmCharts.makeChart("chartdiv", {
"type": "pie",
"theme": "none",
"dataProvider": [
{
"country": "Lithuania",
"litres": 501.9
},
{
"country": "Czech Republic",
"litres": 301.9
}, {
"country": "Ireland",
"litres": 201.1
}, {
"country": "Germany",
"litres": 165.8
}, {
"country": "Australia",
"litres": 139.9
}, {
"country": "Austria",
"litres": 128.3
}, {
"country": "UK",
"litres": 99
}, {
"country": "Belgium",
"litres": 60
}, {
"country": "The Netherlands",
"litres": 50
}],
"valueField": "litres",
"titleField": "country",
"colorField": "color"
});
function test() {
chart.dataProvider[1].color = "#33cc33";
chart.validateData();
}