archive-gh-me/Chart.js
1
0
Fork 0
mirror of https://github.com/chartjs/Chart.js.git synced 2025-12-08 20:36:08 +00:00
Code Issues Projects Releases Wiki Activity

Add documentation about setting default tooltip font (#11968)

Browse Source
This commit is contained in:
Jacco van den Berg 2024-12-01 10:49:55 +01:00 committed by GitHub
parent 79773b7243
commit 4d034a0275
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 17 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
docs/configuration/tooltip.md
View File

@ -4,6 +4,10 @@
Namespace: `options.plugins.tooltip`, the global options for the chart tooltips is defined in `Chart.defaults.plugins.tooltip`.
:::warning
The `titleFont`, `bodyFont` and `footerFont` options default to the `Chart.defaults.font` options. To change the overrides for those options, you will need to pass a function that returns a font object. See section about [overriding default fonts](#default-font-overrides) for extra information below.
:::
| Name | Type | Default | Description
| ---- | ---- | ------- | -----------
| `enabled` | `boolean` | `true` | Are on-canvas tooltips enabled?
@ -420,7 +424,7 @@ Tooltip.positioners.myCustomPositioner = function(elements, eventPosition) {
};
// Then, to use it...
new Chart.js(ctx, {
new Chart(ctx, {
data,
options: {
plugins: {
@ -443,3 +447,15 @@ declare module 'chart.js' {
}
}
```
## Default font overrides
By default, the `titleFont`, `bodyFont` and `footerFont` listen to the `Chart.defaults.font` options for setting its values.
Overriding these normally by accessing the object won't work because it is backed by a get function that looks to the default `font` namespace.
So you will need to override this get function with your own function that returns the desired config.
Example:
```javascript
Chart.defaults.plugins.tooltip.titleFont = () => ({ size: 20, lineHeight: 1.2, weight: 800 });
```