It would be nice to have the option to change transparency for fillColor

[purpleferret]

To fit the look it would be nice to get the option to change transparency to even switch it off. E.g. the BarChart has transparent fillColor which is hard coded.

[jtblin]

You can change the transparency as much as you want with rgba, nothing is hardcoded on this side. Maybe you meant to open an issue in Chart.js project?

[purpleferret]

OK, I see. It is possible to use Chart.js options directly. Unfortunately with this approach you have to provide a colour set for each data set. An example for two data sets:

chart.config(['ChartJsProvider', function (ChartJsProvider) {
    // Configure all bar charts
    ChartJsProvider.setOptions('Bar', {
      colours: [
        {
          fillColor: "rgba(224, 108, 112, 1)",
          strokeColor: "rgba(207,100,103,1)"
        },
        {
          fillColor: 'rgba(144, 185, 18, 1)',
          strokeColor: 'rgba(47, 132, 71, 1)',
          highlightFill: 'rgba(47, 132, 71, 1)',
          highlightStroke: 'rgba(47, 132, 71, 1)'
        }
      ],
    });
}]);

[jtblin]

I see. Maybe we could add a global option for the fill colour.

[samirfor]

I did something like this for workaround while I wait for a global setting:

function generateColors() {
    var colors = [];
    var arrayColors = [
        "206, 120, 255",
        "71, 160, 220",
        "218, 255, 0",
        "91, 200, 84",
        "255, 194, 193",
        "255, 66, 68",
        "255, 231, 151",
        "255, 167, 40",
        "242, 218, 254",
        "146, 101, 194",
        "220, 220, 170",
        "217, 129, 80"
    ];

    for (var i = 0, countColors = arrayColors.length; i < countColors; i++) {
        var rgb = arrayColors[i];
        colors.push({
            'fillColor': "rgba(0,0,0,0)",
            'strokeColor': "rgba(" + rgb + ",1)",
            'pointColor': "rgba(" + rgb + ",1)",
            'pointHighlightStroke': "rgba(" + rgb + ",0.8)",
            'pointStrokeColor': "#fff",
            'pointHighlightFill': "#fff"
        });
    }
    return colors;
}

[skptr]

how about line fill color transparancy .........

[SBado]

It seems to me that you actually force color transparency. Take a look at GetColor (color) function:

backgroundColor: rgba(color, 0.2),

You force alpha to .2. I changed it to:

backgroundColor: rgba(color, alpha),

to get the transparency I wanted.