У меня есть следующая гистограмма. вот параметры javascript для него:
public chartOptions = {
responsive: true,
maintainAspectRatio: false,
legend: {
display: true,
labels: {
fontColor: "black",
fontSize: 12,
},
},
scales: {
yAxes: [
{
display: true,
stacked: false,
scaleLabel: {
display: true,
labelString: "Number of Students",
},
ticks: {
stepSize: 5,
min: 0,
max: 30,
fontSize: 12,
fontColor: "black",
},
},
],
xAxes: [
{
display: true,
stacked: false,
ticks: {
fontSize: 12,
fontColor: "black",
precision: 0,
},
},
],
},
};
Вот html:
<canvas
baseChart
[datasets] = "chartData"
[labels] = "chartLabels"
[options] = "chartOptions"
[colors] = "chartColors"
[plugins] = "[]"
[legend] = "true"
[chartType] = "'bar'"
height = "300px"
>
</canvas>
Иногда на столбцах появляются метки данных (см. рисунок), но я не могу понять, как изменить цвет, чтобы сделать их белыми. Кто-нибудь знает?
ОБНОВИТЬ:
Вот диаграмма с новыми параметрами диаграммы, но по-прежнему не меняет цвет меток данных:
chartOptions = {
responsive: true,
maintainAspectRatio: false,
legend: {
display: true,
},
scales: {
yAxes: [
{
display: true,
stacked: false,
scaleLabel: {
display: true,
labelString: "Number of Students",
},
ticks: {
stepSize: 5,
min: 0,
max: 30,
fontSize: 12,
fontColor: "black",
},
},
],
xAxes: [
{
display: true,
stacked: false,
ticks: {
fontSize: 12,
fontColor: "black",
precision: 0,
},
},
],
},
plugins: {
labels: {
fontColor: "white",
fontSize: 12,
},
},
};
Я думаю, проблема в том, что вы добавляете конфигурацию плагина baels в конфигурацию легенды.
Так должно быть:
options: {
...
plugins: {
labels: {
fontColor: "black",
fontSize: 12,
},
}
...
}
Вы можете поделиться новыми вариантами диаграммы?
добавил новые опции, но все равно не работает, спасибо
Я думаю, что проблема в этом плагине: chartsjs-plugin-data-labels
Проблема была связана с плагином «chartsjs-plugin-data-labels», который у меня был. Исправлено, добавив это в массив наборов данных.
dataLabels: {
colors: ["white"],
},
хорошо, потому что, взглянув на первые опубликованные вами варианты, похоже, что вы использовали метки chartjs-plugin-labels, а не метки chartjs-plugin-data (это 2 разных плагина)
Спасибо, я только что переместил его и изменил его на этот с fontColor как белый, но он по-прежнему показывает их черным