Default visual style in Chart.js bar chart

Question

The doc gives a little example about bar chart:

var data = {
    labels : ["January","February","March","April","May","June","July"],
    datasets : [
        {
            fillColor : "rgba(220,220,220,0.5)",
            strokeColor : "rgba(220,220,220,1)",
            data : [65,59,90,81,56,55,40]
        },
        {
            fillColor : "rgba(151,187,205,0.5)",
            strokeColor : "rgba(151,187,205,1)",
            data : [28,48,40,19,96,27,100]
        }
    ]
}

and then to create the chart using new Chart(ctx).Bar(data);

Is it possible to define the view separately from the data i.e. define fillColor and strokeColor somewhere else leaving only data in datasets objects? Assume I want only one set in datasets.

I want to generate the data (labels and values) in back-end, and leave the view details to the front-end.

The official options don't expect this.

---

Doc: http://www.chartjs.org/docs/#barChart

Answer 1

You are correct in that chartjs does not support those properties as global options.

Fortunately, a quick fix would require you to only change source lines including...

data.datasets[i].fillColor

...to, for instance:

config.fillColor || data.datasets[i].fillColor

...resulting in something similar to:

ctx.fillStyle = config.fillColor || data.datasets[i].fillColor;

The same applies to strokeColor.

Then you can either add a fillColor property to the global config or include it in datasets.