我正在嘗試在使用 chart.js 完成的圖例中增加標簽的字體大小。附上截圖:
我想增加“Label 1,2,3”的字體大小。
在我現在使用的 javascript 配置下方:
var data = {
labels: x_axis_labels,
datasets: [
{
label: 'Label 1',
data: data_1,
borderColor: 'rgb(46,138,207)',
backgroundColor: 'rgb(46,138,207)',
yAxisID: 'y',
},
{
label: 'Label 2',
data: data_2,
borderColor: 'rgb(214,224,52)',
backgroundColor: 'rgb(214,224,52)',
yAxisID: 'y1',
},
{
data: data_3,
label:'Label 3',
borderColor: 'rgb(244,67,54)',
backgroundColor: 'rgb(244,67,54)',
yAxisID: 'y1',
pointStyle:'dash',
borderDash: [20, 30],
pointBackgroundColor: "transparent",
},
]
};
const config = {
type: 'line',
data: data,
options: {
responsive: true,
interaction: {
mode: 'index',
intersect: false,
},
stacked: false,
plugins: {
title: {
display: true,
}
},
scales: {
x:{
title:{
display: true,
text: 'X axis name',
font: {size:30},
},
ticks: {
font: {
size: 20,
}
}
},
y: {
title:{
display: true,
text: 'First y axis name',
font: {size:30}
},
type: 'linear',
display: true,
position: 'left',
ticks: {
font: {
size: 24,
}
}
},
y1: {
title:{
display: true,
text: 'Second Y axis name',
font: {size:30}
},
type: 'linear',
display: true,
position: 'right',
ticks:{
font:{
size:24,
}
},
// grid line settings
grid: {
drawOnChartArea: false,
},
},
},
},
};
我已經嘗試過字體檔案和圖例檔案,但我一無所獲。有人有這方面的經驗嗎?提前致謝
uj5u.com熱心網友回復:
如檔案中所述,您可以在options.plugins.legend.labels.font.size命名空間中設定大小
options: {
plugins: {
legend: {
labels: {
font: {
size: 20
}
}
}
}
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/494989.html
標籤:javascript html 图表.js
上一篇:指定哪個欄位驗證失敗
下一篇:TypeScript中的映射型別
