1.4.4 标题(title
优质
小牛编辑
127浏览
2023-12-01
图表标题定义要在图表顶部绘制的文本。
标题配置
标题在options.title
中配置。图表标题的全局选项在Chart.defaults.global.title
中定义。
名称 | 类型 | 默认值 | 描述 |
---|---|---|---|
display | Boolean | false | 是否显示标题 |
position | String | 'top' | 标题未知更多... |
fontSize | Number | 12 | 字体大小 |
fontFamily | String | "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif" | 字体集 |
fontColor | Color | '#666' | 字体颜色 |
fontStyle | String | 'bold' | 字体样式 |
padding | Number | 10 | 标题文本上下方间距 |
lineHeight | Number/String | 1.2 | 单行文本的高度 (参见 MDN) |
text | String/String[] | '' | 标题文字 |
位置
可用的标题位置为:
'top'
'left'
'bottom'
'right'
示例代码
以下示例将在创建的图表上加上“Custom Chart Title”的标题。
var chart = new Chart(ctx, {
type: "line",
data: data,
options: {
title: {
display: true,
text: "Custom Chart Title"
}
}
});