legendが効かない。。。?
目的:chart.jsの凡例の見た目を調整したい。
事実:options.legend.labelsを編集しても反応が無い。
はて?
V3へのバージョンアップで場所が変わっていた。
原因:検索上位に表示される有志の日本語ドキュメントが軒並み古くなっていたため、バージョンの違いに気付かなかった。
V2: options.legend.labels → V3: options.plugins.legend.labels
V3.8.0においては下記の通り記述します。
const config = {
type: 'line',
data: data,
options: {
plugins: {
legend: {
labels: {
boxWidth: 40,
boxHeight: font.size,
color: Chart.defaults.color,
font: Chart.defaults.font,
padding: 10,
// generateLabels: ,
// filter: null,
// sort: null,
pointStyle: 'circle',
textAlign: 'center',
usePointStyle: FALSE
}
}
}
}
};