Chart.js: Multiple multi-line data labels and vertical spacing/line-height

Created on 26 May 2017  Â·  7Comments  Â·  Source: chartjs/Chart.js

Creating a horizontalBar chart with many multiple-line labels on the left causes (visually) incorrect vertical spacing between them, if the chart is not tall enough. I've tried to properties inside beforeFit/afterFit callbacks but no success so far.

Current Behavior

screen shot 2017-05-26 at 13 48 18

https://jsfiddle.net/ncfs4164/6/

Expected Behavior

User should be able to manually set the spacing (or label's lineHeight?) between lines inside a multi-line label.

  • Chart.js version: 2.5.0 (tho older versions yield the same result)
bug

Most helpful comment

Line-height issue related to https://github.com/chartjs/Chart.js/issues/4379 as well. Are there any plans to allow for configuration of line height? Has anyone found a solution?

Ideally we'd be able to vertically-align labels, but adjusting line height might also help with my issue:
image

All 7 comments

@smogg do you have a fiddle that reproduces this?

@etimberg yup, it was posted in the original message after the picture, here it is again: https://jsfiddle.net/ncfs4164/6/

Sorry, missed that. Thanks for posting it again

@smogg Did you manage to handle the issue?

Line-height issue related to https://github.com/chartjs/Chart.js/issues/4379 as well. Are there any plans to allow for configuration of line height? Has anyone found a solution?

Ideally we'd be able to vertically-align labels, but adjusting line height might also help with my issue:
image

Got the same issue and would love to have vertical align for (multiline-)labels. Any plans or updates on this?

Any workaround for this?

Was this page helpful?
0 / 5 - 0 ratings