fix(echarts): reserve grid room for Gantt category names - #43189
Open
bikash-barnwal wants to merge 1 commit into
Open
fix(echarts): reserve grid room for Gantt category names#43189bikash-barnwal wants to merge 1 commit into
bikash-barnwal wants to merge 1 commit into
Conversation
Gantt renders its category names as markLine labels anchored to the start of the grid. `grid.containLabel` only accounts for axis labels, so a name wider than the default left padding was drawn into the plot area and clipped. Measure the widest category name and add that to the grid's left padding, capped at a quarter of the chart width so one long category cannot eat the plot, and give the label that same width with `overflow: 'truncate'` so anything past the cap ends in an ellipsis rather than overflowing. The text measurement already existed for legend layout; it is renamed from measureLegendTextWidth to measureTextWidth and exported, since it is no longer legend-specific. Its cache is renamed to match. Fixes apache#38844 Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
dosubot
Bot
added
change:frontend
Contributor
Code Review Agent Run #1dc4fbActionable Suggestions - 0Review Details
Bito Usage GuideCommands Type the following command in the pull request comment and save the comment.
Refer to the documentation for additional commands. Configuration This repository uses Documentation & Help AI Code Review powered by |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #43189 +/- ##
=======================================
Coverage 66.64% 66.65%
=======================================
Files 2873 2873
Lines 163625 163630 +5
Branches 37767 37769 +2
=======================================
+ Hits 109053 109061 +8
+ Misses 52442 52439 -3
Partials 2130 2130
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
This was referenced Aug 14, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
SUMMARY
Gantt chart category names are cut off on the left.
They are not axis labels — they are rendered as
markLinelabels anchored to the start of the grid (Gantt/transformProps.ts,position: 'start',formatter: '{b}').grid.containLabelonly reserves space for axis labels, so a category name wider than the default left padding gets drawn into the plot area and clipped by the chart edge.The fix measures the widest category name and adds it to the grid's left padding, capped at a quarter of the chart width so one very long category cannot eat the plot. The label is given that same width with
overflow: 'truncate', so anything past the cap ends in an ellipsis instead of overflowing whatever was reserved.The text measurement already existed for legend layout, canvas-based with a cache and a character-width fallback when there is no
document. It is renamedmeasureLegendTextWidth→measureTextWidthand exported, since it is no longer legend-specific; the cache constant is renamed to match. No behavior change for the legend.BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
Before: long category names truncated by the plot edge with no ellipsis, some unreadable.
After: the grid shifts right to fit the names; names beyond 25% of chart width end in an ellipsis.
TESTING INSTRUCTIONS
773 tests across 69 suites pass (the whole echarts plugin, since the shared measurement helper was touched). The new test asserts that a long category reserves more left padding than a short one, that the label truncates, and that the reserved width stays within the 25% cap.
One existing expectation in
Gantt/transformProps.test.tswas updated: its exhaustivetoEqualon the categorymarkLineseries now includes the newwidth/overflowlabel fields.Manually: build a Gantt chart whose y-axis dimension has long values and confirm the names render fully rather than clipped.
ADDITIONAL INFORMATION
🤖 Generated with Claude Code