wykres słupkowy-kąt.js ze 100% nieprzezroczystością koloru

Question

AKTUALIZACJA 02-CZERWCA-2017: Usunęliśmy problem, ale nie z odpowiedzi tutaj. Postaram się dodać rozwiązanie, które mamy, jeśli je znajdę. Przełączyliśmy również na angular-nvd3, który używa d3.

EDIT 1: Dodano backgroundColor w opcji, nadal robi praca. Nie jestem pewien, czy umieściłem go we właściwym miejscu.

Korzystanie z próbki here. Jak sprawić, aby kolor wypełnił się w 100%?

JS:

$scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']; 
$scope.type = 'StackedBar'; 
$scope.series = ['2015', '2016']; 
//$scope.colors = ['#AA1921', '#18AF5C']; 
$scope.options = { 
    scales: { 
     xAxes: [{ 
      stacked: true, 
     }], 
     yAxes: [{ 
      stacked: true 
     }] 
    }, 
    title: { 
     display: true, 
     text: 'My First Bar Chart' 
    }, 
    // added as suggested 
    backgroundColor: ['rgba(170, 25, 33, 1)', 'rgba(170, 25, 33, 1)'] 
}; 
$scope.data = [ 
    [65, 59, 90, 81, 56, 55, 40], 
    [28, 48, 40, 19, 96, 27, 100] 
]; 

HTML

<canvas class="chart chart-bar" 
    chart-data="data" 
    chart-labels="labels" 
    chart-options="options" 
    chart-series="series" 
    chart-colors="colors"></canvas> 
    <!-- chart-colors is removed when using the backgroundColor --> 

naprawdę chcę korzystać z tego rodzaju realizacji, ale większość problemów znajdę używasz innego realizację.

Answer 1

Wykres kątowy JS używa chart-options z ChartJS Option Configuration. Ustaw backgroundColor w opcjach.

Źródło: https://github.com/jtblin/angular-chart.js

Answer 2

spróbuj dodać kolory takie jak to powinno działać:

rgba(170, 25, 33, 1) 

Answer 3

Musisz zadeklarować pełną obiekt kolorów, jeśli chcesz grać z kryciem. Można użyć hex lub rgba

html:

<canvas class="chart chart-bar" 
    chart-data="data" 
    chart-labels="labels" 
    chart-options="options" 
    chart-series="series" 
    chart-colors="colors"></canvas> 

JS:

$scope.compareChart.colors = [ 
    { 
     backgroundColor: '#b3e7fb', 
     borderColor: '#b3e7fb', 
     hoverBackgroundColor: '#b3e7fb', 
     hoverBorderColor: '#b3e7fb' 
    } 
]; 

Zobacz https://github.com/jtblin/angular-chart.js/issues/131