javascript - 如何使用Chart.js为条形图中的每个条设置颜色？

我希望这个图表中的条有我自己选择的不同颜色。我不想对条（或一组条）使用随机颜色。

var ctx = $("#myBarChart").get(0).getContext("2d");
var data = {
labels: ["a","b","c","d","e","f","g"],
datasets: [
    {
        label: "My First dataset",
        /*fillColor: "rgba(84,255,159,1)",
        highlightFill: "rgba(84,255,159,0.75)",*/
        data: [5,3, 4, 2, 1, 3, 1]
    },
]};

var myBarChart = new Chart(ctx).Bar(data);
var width = $('canvas').parent().width();
$('canvas').attr("width",width);
new Chart(ctx).Bar(data);

最佳答案

可以使用索引器（如数组）访问数据集及其单条：

myBarChart.datasets[0].bars[0].fillColor = "#2ECC71";
myBarChart.datasets[0].bars[0].highlightFill = "#58D68D";
myBarChart.datasets[0].bars[1].fillColor = "#3498DB";
myBarChart.datasets[0].bars[1].highlightFill = "#5DADE2";