We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
The max allowed width for y-labels show be about 50% of chart width. It works this way for side-by-side axes.
If y-axes are stacked, this is not holds.
https://codepen.io/jkmnt/pen/mdgzXVv
Resize the browser window to see the effect.
It appears the chart.js always calculates the max allowed axis width as chart width / 2 / number of axes regardless of stacking enabled.
chart width / 2 / number of axes
Chart.js/src/core/core.layouts.js
Line 401 in 1777f95
This picture confirms the suspision. Same chart as above, but without stacking.
The workaround I use now is the afterFit callback on every axis patching it width:
afterFit: (axis) => { const widest = (axis as any)._labelSizes?.widest?.width; if (widest && axis.width < widest + 8) { axis.width = widest + 8; } },
No response
v4.4.2
The text was updated successfully, but these errors were encountered:
No branches or pull requests
Expected behavior
The max allowed width for y-labels show be about 50% of chart width.
It works this way for side-by-side axes.
Current behavior
If y-axes are stacked, this is not holds.
Reproducible sample
https://codepen.io/jkmnt/pen/mdgzXVv
Optional extra steps/info to reproduce
Resize the browser window to see the effect.
Possible solution
It appears the chart.js always calculates the max allowed axis width as
chart width / 2 / number of axes
regardless of stacking enabled.Chart.js/src/core/core.layouts.js
Line 401 in 1777f95
This picture confirms the suspision. Same chart as above, but without stacking.
The workaround I use now is the afterFit callback on every axis patching it width:
Context
No response
chart.js version
v4.4.2
Browser name and version
No response
Link to your project
No response
The text was updated successfully, but these errors were encountered: