Amcharts Colors Issue
https://github.com/GrantMStevens/amCharts-Angular/issues/34
by wholypantalones
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.13.0/amcharts.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.13.0/serial.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.13.0/themes/light.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.13.0/themes/chalk.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.13.0/themes/black.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.13.0/themes/dark.js"></script>
<script src="https://rawgit.com/ThumbsAlmighty/amCharts-Angular/master/dist/amChartsDirective.js"></script>
<div ng-app="amChartsDirectiveExample">
<div ng-controller="amChartsController" style="height: 400px; width: 600px;">
<am-chart id="myFirstChart" options="amChartOptions"></am-chart>
</div>
</div>
JavaScript
angular.module('amChartsDirectiveExample', ['amChartsDirective']).controller('amChartsController', function($scope) {
$scope.amChartOptions = {
data: [{
year: 2005,
income: 23.5,
expenses: 18.1
}, {
year: 2006,
income: 26.2,
expenses: 22.8
}, {
year: 2007,
income: 30.1,
expenses: 23.9
}, {
year: 2008,
income: 29.5,
expenses: 25.1
}, {
year: 2009,
income: 24.6,
expenses: 25
}],
type: "serial",
theme: 'black',
colors: [
"#B0DE09",
"#0D8ECF",
"#2A0CD0",
"#CD0D74",
"#CC0000",
"#00CC00",
"#0000CC",
"#DDDDDD",
"#999999",
"#333333",
"#990000"
],
categoryField: "year",
rotate: true,
pathToImages: 'https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.13.0/images/',
legend: {
enabled: true
},
chartScrollbar: {
enabled: true,
},
categoryAxis: {
gridPosition: "start",
parseDates: false
},
valueAxes: [{
position: "top",
title: "Million USD"
}],
graphs: [{
type: "column",
title: "Income",
valueField: "income",
fillAlphas: 1,
}]
}
});