Question

我有一个使用http://www.chartjs.org的简单图表，如：

<script>
        var canvas = document.getElementById('myChart2');
        var data = {
            labels: ["Eating", "Drinking", "Sleeping", "Designing", "Coding", "Cycling", "Running"],
            datasets: [{
                label: "My First dataset",
                backgroundColor: "rgba(179,181,198,0.2)",
                borderColor: "rgba(179,181,198,1)",
                pointBackgroundColor: "rgba(179,181,198,1)",
                pointBorderColor: "#fff",
                pointHoverBackgroundColor: "#fff",
                pointHoverBorderColor: "rgba(179,181,198,1)",
                data: [65, 59, 90, 81, 56, 55, 40]
            }, {
                label: "My Second dataset",
                backgroundColor: "rgba(255,99,132,0.2)",
                borderColor: "rgba(255,99,132,1)",
                pointBackgroundColor: "rgba(255,99,132,1)",
                pointBorderColor: "#fff",
                pointHoverBackgroundColor: "#fff",
                pointHoverBorderColor: "rgba(255,99,132,1)",
                data: [28, 48, 40, 19, 96, 27, 100]
            }]
        };
        var option = {
            showLines: false
        };
        var myLineChart = Chart.Radar(canvas, {
            data: data,
            options: option
        });
    </script>

我在文档中寻找但是我找不到如何更改所有标签的颜色？

在我的例子中，我需要更改labels: ["Eating", "Drinking", "Sleeping", "Designing", "Coding", "Cycling", "Running"]或label: "My First dataset",

的颜色

有什么想法吗？

Answer 1

/*Global settings*/
    Chart.defaults.global.defaultFontColor = '#fff';

Answer 2

如果有人使用带有Typescript的ng2-charts：

组件中的

：

private lineChartOptions:any = {
    legend : {
        labels : {
          fontColor : '#ffffff'  
        }
    }
};

在模板中：

<canvas baseChart [options]="lineChartOptions"></canvas>

Chart.js更改标签字体颜色

2 个答案: