扫码一下
查看教程更方便
有一些特殊的全局设置可以更改图表上的所有字体。 这些选项在 Chart.defaults.font 中。 全局字体设置仅在配置中不包含更具体的选项时适用。
例如,在此图表中,除了图例中的标签外,文本的字体大小为 16 像素。
Chart.defaults.font.size = 16;
let chart = new Chart(ctx, {
type: 'line',
data: data,
options: {
plugins: {
legend: {
labels: {
// 这个更具体的字体属性会覆盖全局属性
font: {
size: 14
}
}
}
}
}
});
名称 | 类型 | 默认值 | 描述 |
---|---|---|---|
family | string | "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif" | 所有文本的默认字体系列,遵循 CSS 字体系列选项。 |
size | number | 12 | 文本的默认字体大小(以 px 为单位)。 不适用于径向线性刻度点标签。 |
style | string | 'normal' | 默认字体样式。 不适用于工具提示标题或页脚。 不适用于图表标题。 遵循 CSS 字体样式选项(即 normal, italic, oblique, initial, inherit)。 |
weight | string | undefined | 默认字体粗细(粗体)。 |
lineHeight | number | string | 1.2 |
如果为系统上确实存在的图表指定了字体,则浏览器在设置时不会应用该字体。 如果发现图表中出现奇怪的字体,请检查应用的字体是否存在于你的系统中。
如果字体未缓存且需要加载,则在加载字体后需要更新使用该字体的图表。 这可以使用字体加载 API 来完成。