2016-10-20 3 views
1

Ich bin Donut-Diagramm mit angular-chart.js integrieren und ich möchte benutzerdefinierte Farbe basierend auf Diagramm Label-Wert verwenden.angular-chart.js benutzerdefinierte Farbe basierend auf Diagramm Label-Werte

//Controller 
    vm.labels = ["A", "B", "C"]; 
    vm.data = [1, 2, 3]; 

//HTML 
    <canvas id="doughnut" class="chart chart-doughnut" 
         chart-data="vm.data" 
         chart-labels="vm.labels"      
         chart-options="options" 
         chart-colors = "colours" 
         chart-legend = "true" > 
    </canvas> 

und ich bin Einstellung der Farbe wie unter

ChartJsProvider.setOptions({ 
     colours: ['#DD1C2C', '#E03E2D','#E35B2B'], 
     responsive: true 
}); 

Es funktioniert nur perfekt, wenn alle A, B und C gibt es (A => #DD1C2C B=> #E03E2D und C=>#E35B2B)

Aber für den folgenden Fall

$scope.labels = ["A", "C"]; 
$scope.data = [1, 3]; 

A => #DD1C2C und C=>#E03E2D

Erwartet: A => #DD1C2C und C=>#E35B2B

Antwort

0

Haben Sie versucht, die fehlenden Teile mit leeren String und 0 wie

$scope.labels = ["A", "", "C"]; 
$scope.data = [1, 0, 3]; 
zu füllen
Verwandte Themen