chartjs / chartjs/chartjs-plugin-datalabels
Padding and lineHeight has no effect
- Dominant language
- JavaScript
- Stars
- 920
- Forks
- 507
- PR merge metrics
- No merged PRs in 30d
Description
Hi!

I am trying to vertically center the datalabels in my horizontal bar chart, so they are perfectly vertically aligned in the middle of the bar. As you can see they are a little bit more to the top of the bar.
To achieve this I tried to give some padding or a font.lineHeight, but both options have zero effect at all, as they were ignored.
I could use the offset with bottom alignment, but this is already used for the left/right positioning of the labels. So not many options are left. Why is the padding not working?
This is my configuration:
```Javascript
datalabels: {
font: {
size: 10,
weight: "bold",
},
clip: true,
anchor: "start",
align: "start",
offset: ({ dataset, dataIndex }) => {
const value = dataset.data[dataIndex];
return value <= 10 ?
0 :
value % 1 ? -39 : -31;
},
formatter: value => localeUtils.toLocaleString(value, "de-DE", 1) + "%",
}
```
Tried it like that:
```Javascript
datalabels: {
font: {
size: 10,
weight: "bold",
lineHeight: 2,
},
...
}
```
Or
```Javascript
datalabels: {
padding: { top: 20 }
...
}
```
Nothing happens.
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.