Skip to content

[WIP] feat(axis): improve axis label overflow computation#2845

Draft
biamalveiro wants to merge 9 commits into
elastic:mainfrom
biamalveiro:feat/axis-label-overflow
Draft

[WIP] feat(axis): improve axis label overflow computation#2845
biamalveiro wants to merge 9 commits into
elastic:mainfrom
biamalveiro:feat/axis-label-overflow

Conversation

@biamalveiro
Copy link
Copy Markdown
Contributor

@biamalveiro biamalveiro commented May 27, 2026

WIP 🏗️

Summary

Improves axis tick label overflow, by improving chart sizing logic and adding label wrapping. Closes #1490

Screenshot 2026-05-27 at 08 38 47

Details

Axis margins were estimated before labels were fully measured, which could cull labels when there would be space for them. Now, the flow measures each label geometry (including ability to wrap), uses that to size each axis side, and re-projects ticks inside the updated plot area until margins stabilize.

  • For tick management, use each axis tick label size, instead of always considering max. (createTickLayout)
  • Add max sizing for axis (cross size)
    • currently in theme but axis spec property instead?
    • add min size for tick label
  • Add multi-pass chart size layout function, to account for adjustments after sizing labels.
    • kiwi?
  • Validate for rotation and alignemnt of tick label boxes
  • Remove truncation in formatter and bring back 'start', 'middle', 'end' truncation options
  • Clean up
    • Review selectors after layout change, do we need a selector for baseline ticks in state now that we have layout?
    • Repeated logic in getAxesDimension/getAxesGeometries
  • Test!

Issues

Checklist

  • The proper chart type label has been added (e.g. :xy, :partition)
  • The proper feature labels have been added (e.g. :interactions, :axis)
  • All related issues have been linked (i.e. closes #123, fixes #123)
  • New public API exports have been added to packages/charts/src/index.ts
  • Unit tests have been added or updated to match the most common scenarios
  • The proper documentation and/or storybook story has been added or updated
  • The code has been checked for cross-browser compatibility (Chrome, Firefox, Safari, Edge)
  • Visual changes have been tested with light and dark themes

@elastic-datavis
Copy link
Copy Markdown
Contributor

⏳ Pending Deployment (build#428) - cae948e

  • ⏳ Storybook
  • ⏳ e2e server
  • ⏳ Playwright VRT report
  • ⏳ Playwright A11Y report

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

Successfully merging this pull request may close these issues.

[xy] Nicely compute the axis label overflow

1 participant