如果通过回调定义图例,则不会拾取背景色

时间:2019-05-20 21:12:28

标签: chart.js chart.js2

使用甜甜圈图并使用回调(属性可编写脚本)定义backgroundColor会以期望的颜色呈现圆弧,但所有图例框均为深灰色。

将backgroundColor切换为数组会导致问题消失,但是不允许基于标签设置颜色。

var chart = new Chart(ctx, {
    type:   'doughnut',
    data: {
        labels: labels,
        datasets: [{
            data: data,
            backgroundColor:    function(context) {
                var index=context.dataIndex;
                switch(labels[index]) {
                case "Work in progress":
                    return 'rgba(0,123,255,0.5)';
                    break;
                case "Submitted":
                    return 'rgba(255,193,7,0.5)';
                    break;
                case "Approved":
                    return 'rgba(23,162,184,0.5)';
                    break;
                case "Paid":
                    return 'rgba(40,167,69,0.5)';
                    break;
                case "Rejected":
                    return 'rgba(220,53,69,0.5)';
                    break;
                default:
                    return 'rgba(0,0,0,0.1)';
                }
            },
        }]
    },
});

我希望图例使用与实际弧线相同的颜色。

0 个答案:

没有答案