Подтвердить что ты не робот

Изменение цвета шрифта ярлыка для линейной диаграммы с использованием Chart.js

Я использую Chart.js для создания некоторых диаграмм. Для линейной диаграммы требуются метки. Я не могу понять, как изменить цвет этих меток.

var chartGood = "rgba(50,182,93,0.5)";
var lineChartData = {
        labels : ["3/14","3/15","3/16","3/17","3/18","3/19","3/20","3/21","3/22","3/23"],
        datasets : [
            {
                fillColor : chartGood,
                strokeColor : "rgba(255,255,255,1)",
                pointColor : "rgba(50,182,93,1)",
                pointStrokeColor : "#fff",
                data : [12, 21, 28, 29, 31, 55, 52, 50, 49, 59]
            }
        ]
    }

var myLine = new Chart(document.getElementById("cpu-chart").getContext("2d")).Line(lineChartData);

Я пробовал:

labelColor : "#fff",

legend : {
    font : {
        color : "#fff"
    }
}

label : {
    font : {
        color : "#fff"
    }
}

И еще несколько комбинаций, но ничего не работает. Я думал, что нашел то, что искал в docs

//String - Scale label font colour  
    scaleFontColor : "#fff",

но это также не решило мою проблему.

4b9b3361

Ответ 1

Да, параметр scaleFontColor изменяет цвет меток.

Вероятно, вы пытались добавить его в объект данных, поэтому он не работал. На самом деле он должен быть передан как второй параметр функции Line следующим образом:

var myLine = new Chart(document.getElementById("cpu-chart").getContext("2d"))
    .Line(lineChartData, { scaleFontColor: "#ff0000" });

Изменить:

Аналогично, чтобы изменить размер шрифта, используйте scaleFontSize.

Пример:

scaleFontSize: 16