Chart.js标签颜色 [英] Chart.js label color

问题描述

我正在使用chart.js创建条形图，似乎无法更改标签颜色或图例颜色。我想出了如何改变刻度颜色，但我不知道在哪里放'scaleFontColor'，如果这确实是我需要使用的。

I'm using chart.js to create a bar chart and can't seem to change the label colors or the legend colors. I figured out how to change the tick colors, but I'm not sure where to put the 'scaleFontColor', if that is indeed what I need to be using.

这是现在看起来的链接。
http://imgur.com/nxaH1mk

Here is a link to what it looks like now. http://imgur.com/nxaH1mk

这是我的代码：

var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
    scaleFontColor: "white",
    type: "bar",
    data: {
        labels: <?php echo json_encode($timeSlice); ?>, 
        datasets: [{
            label: "A Label",
            backgroundColor: "rgba(159,170,174,0.8)",
            borderWidth: 1,
            hoverBackgroundColor: "rgba(232,105,90,0.8)",
            hoverBorderColor: "orange",
            scaleStepWidth: 1,
            data: <?php echo json_encode($myCount); ?>
        }]
    },
    options: {
        legend: {
            fontColor: "white"
        },
        scales: { 
            yAxes: [{
                ticks: {
                    fontColor: "white",
                    stepSize: 1,
                    beginAtZero: true
                }
            }]
        }
    }
});

我们非常感谢任何帮助。

Any help would be greatly appreciated.

推荐答案

Guh我解决了，抱歉这个问题。但我想我会留下一个答案，以防其他人遇到我的问题。

Guh I solved it, sorry about the question. But I guess I'll leave an answer in case anyone else runs into my problem.

var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
    type: "bar",
    data: {
        labels: <?php echo json_encode($timeSlice); ?>, 
        datasets: [{
            label: "My Label",
            backgroundColor: "rgba(159,170,174,0.8)",
            borderWidth: 1,
            hoverBackgroundColor: "rgba(232,105,90,0.8)",
            hoverBorderColor: "orange",
            scaleStepWidth: 1,
            data: <?php echo json_encode($myCount); ?>
        }]
    },
    options: { 
        legend: {
            labels: {
                fontColor: "white",
                fontSize: 18
            }
        },
        scales: {
            yAxes: [{
                ticks: {
                    fontColor: "white",
                    fontSize: 18,
                    stepSize: 1,
                    beginAtZero: true
                }
            }],
            xAxes: [{
                ticks: {
                    fontColor: "white",
                    fontSize: 14,
                    stepSize: 1,
                    beginAtZero: true
                }
            }]
        }
    }
});

这篇关于Chart.js标签颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！