I have successfully implemented a chart in my code. The background color for the legend is determined by $scope.colors, but in this example, I only have 3 static datasets. However, my issue arises when the data comes from the database.
Is it possible for the generated colors of the graph to also be used as the background color for the legends?
Check out the source link for the chart
var app = angular.module('App', ['chart.js']);
app.controller('Ctrl', function ($scope) {
$scope.labels = ["A","B","C"];
$scope.data = ["1","2","3"];
$scope.colours = ['#bff0dd', '#ffa67b','#b1c2ff'];
});<html ng-app="App" ng-controller="Ctrl">
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-chart.js/0.10.2/angular-chart.js"></script>
</head>
<body>
<canvas id="doughnut" class="chart chart-doughnut doughnut-year"
chart-colours="colours"
chart-data="data" chart-labels="labels">
</canvas>
<h3>Legends</h3>
<div class="legend-item" ng-repeat="a in colours">
<label>
A
</label>
</div>
</body>
</html>