Skip to content
New issue

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

X-axis labels don't auto-rotate after crossing a threshold in horizontal bar charts #578

Open
Kshitijde opened this issue Feb 19, 2024 · 0 comments

Comments

@Kshitijde
Copy link

Kshitijde commented Feb 19, 2024

Description

X-axis labels don't auto-rotate after crossing a threshold in horizontal bar charts. They auto-rotate by 45 degrees as expected for vertical bar charts but don't for horizontal ones.

Library Versions:
"react-apexcharts": "1.4.0",
"apexcharts": "3.44.0",

Steps to Reproduce

  1. Create a horizontal bar chart
  2. Ensure you have large labels on the x-axis
  3. Ensure "rotateAlways" if passed as a parameter is false (this is the default value if not passed)

Expected Behavior

X-axis labels auto-rotate after they don't fit in the provided space.

Actual Behavior

No rotation occurs. Labels are still displayed normally and are not easy to read.

Screenshots

image

Reproduction Link

https://codepen.io/kshitijdeshpande/pen/ZEPPjbw

Works fine in vertical bar charts: https://codepen.io/kshitijdeshpande/pen/XWGGBdL

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant