[Bug]: Radar: labels get cut off when shrinking screen size #2033
Description
Relevant package(s)
- @carbon/charts
- @carbon/charts-svelte
- @carbon/charts-react
- @carbon/charts-angular
- @carbon/charts-vue
- Documentation website
Carbon Charts Version
1.22.3
Which bundler are you using?
Webpack
What happened and what did you expect to happen?
Apparently radar Charts do not take the actual length of their labels into consideration when the available screen size resizes.
E.g. When the size decreases, labels get cut off before the charts itself shrinks.
I would expect all labels to be fully readable at all times, i.e. shrinking the chart before a label would get cut off.
Having a look into the code (https://github.com/carbon-design-system/carbon-charts/blob/main/packages/core/src/components/graphs/radar.ts#L73) it looks like the labelHeight is taken instead of the actual length (width) (which depends on the text of the label).
This is reproducible in your documentation (https://charts.carbondesignsystem.com/radar) when shrinking the screen size, e.g.:
Chart data and options (automatically formatted so no need for backticks)
JavaScript console or build output (if relevant)
StackBlitz repro
No response
IBM Application/Team (if relevant)
No response
What priority level would this be in your opinion?
P1 (High)