You are viewing a plain text version of this content. The canonical link for it is here.

Posted to commits@echarts.apache.org by "Rohitgiri02 (via GitHub)" <gi...@apache.org> on 2025/11/27 09:08:44 UTC

[PR] fix(grid): respect axisLabel.width when containLabel is true [echarts]

Rohitgiri02 opened a new pull request, #21392:
URL: https://github.com/apache/echarts/pull/21392

Previously, when grid.containLabel was set to true, the grid layout calculation used the actual text width instead of the configured axisLabel.width, causing incorrect layout when overflow was set to 'truncate'.

This fix checks if axisLabel.width is configured and uses that value for grid layout calculation, ensuring consistent behavior.

Fixes #16111

## Brief Information

This pull request is in the type of:

- [x] bug fixing
- [ ] new feature
- [ ] others

### What does this PR do?

Fix grid layout calculation to respect `axisLabel.width` configuration when `grid.containLabel` is enabled and `overflow` is set to `'truncate'`.

### Fixed issues

- #16111: Grid doesn't respect axisLabel.width when containLabel is true

## Details

### Before: What was the problem?

When `grid.containLabel` was set to `true` and `yAxis.axisLabel.width` was configured with `overflow: 'truncate'`, the grid layout calculation incorrectly used the **actual text width** instead of the **configured width value**. This caused the grid to reserve too much space for axis labels, resulting in incorrect chart layout.

**Example of the bug:**
// xAxis use proportion on x, yAxis use proprotion on y, otherwise not.
fillMarginOnOneDimension(labelInfo.rect, xyIdx, proportion);
fillMarginOnOneDimension(labelInfo.rect, 1 - xyIdx, NaN);
```

In this case, the grid would reserve space based on the full text width (e.g., 500px) instead of the configured 300px, causing layout issues.

### After: How does it behave after the fixing?

The grid layout calculation now correctly:
1. Checks if `axisLabel.width` is configured
2. Uses the configured width value for grid margin calculation when available
3. Handles both `string` and `number` types for the width value
4. Falls back to actual text width when no width is configured

**After the fix:**
- Grid correctly reserves 300px as configured
- Layout is consistent with the user's intention
- Text is properly truncated at the specified width

**Implementation:**
Modified the `fillLabelNameOverflowOnOneDimension` function in `src/coord/cartesian/Grid.ts` to retrieve the configured `axisLabel.width` and apply it to the label rect before margin calculation.

## Document Info

One of the following should be checked.

- [x] This PR doesn't relate to document changes
- [ ] The document should be updated later
- [ ] The document changes have been made in apache/echarts-doc#xxx

## Misc

### Security Checking

- [x] This PR does not use security-sensitive Web APIs.

### ZRender Changes

- [x] This PR does not depend on ZRender changes.

### Related test cases or examples to use the new APIs

Manual test case added: `test/bug-16111.html`

This test demonstrates the fix by showing a chart with:
- `grid.containLabel: true`
- `yAxis.axisLabel.width: 300`
- `yAxis.axisLabel.overflow: 'truncate'`
- Long Chinese text that exceeds 300px

Before the fix, the grid would overflow. After the fix, it correctly respects the 300px width.

### Merging options

- [x] Please squash the commits into a single one when merging.

### Other information

This is my first contribution to Apache ECharts. The fix is minimal and focused on the specific issue - it only affects grid layout calculation when both `containLabel: true` and `axisLabel.width` are configured together.

The fix properly handles type conversion from `string | number` to `number` and only applies to y-axis labels (where width is the relevant dimension for horizontal layout).

--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org

---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org

Re: [PR] fix(grid): respect axisLabel.width when containLabel is true [echarts]

Posted by "Justin-ZS (via GitHub)" <gi...@apache.org>.

Justin-ZS commented on PR #21392:
URL: https://github.com/apache/echarts/pull/21392#issuecomment-3673029388

   [containLabel](https://echarts.apache.org/examples/zh/editor.html?c=pie-simple&code=TVFNS8NAEL3vr5hbFEJIK6JEPKggCHpqwUPxMEmmyeI2E3Yn_aD4351N2ioku_O1b9684V4sd_AIR9N4Wxd6O1pLAXlqhPvxLlmEN6PJg5B_5qGrwwfXVEAScENJCv8SL9wJ2k5zuLfhHUtyiflJzeFJ3djgEh4dZ5tY623TSpKana2lLeAmj9225NeOd5oWP3QVirYy5JztQ4RKsizTgGIbOfSRTSxp2B80WqNgASsDkCxb8gQ2AELvuXS0gZ2VFqTVWI8eG499m8Ib0L6nSjRB4KhrtIbXUE0DjZRBGEqCEgPVoMKNQ2WXibKRPtguCKEWrEcorGRAfUp70cZaoPSU1ifVk7Fsh8l49XYyFhi1iMbQqfE1Drk_C3gadotuiIJoKpC3pLmVOZ4Hn83zFOYqI8xu9bjX_y46s3jc5Ap5ginRK0hoefeM1Xfj4xILUMFJV3-JLOTgtPpoKnbs48KaEq9mEfbvyLP59URIv0j64Rc&enc=deflate) is deprecated since 6.0
   you can use the new outerBoundsMode to avoid this bug. [demo](https://echarts.apache.org/examples/zh/editor.html?c=pie-simple&code=TVFNS8NAEL3vr5hbFEJIK6JEPKggCHpqwUPxMEmmyeI2E3Yn_aD4351N2ioku_O1b9684V4sd_AIR9N4Wxd6O1pLAXlqhPvxLlmEN6PJg5B_5qGrwwfXVEAScENJCv8SL9wJ2k5zuLfhHUtyiflJzeFJ3djgEh4dZ5tY623TSpKana2lLeAmj9225NeOd5oWP3QVirYy5JztQ4RKsizTgGIbOfSRTSxp2B80WqNgASsDkCxb8gQ2AELvuXS0gZ2VFqTVWI8eG499m8Ib0L6nSjRB4KhrtIbXUE0DjZRBGEqCEgPVoMKNQ2WXibKRPtguCKEWrEcorGRAfUp70cZaoPSU1ifVk7Fsh8l49XYyFhi1iMbQqfE1Drk_C3gadotuiIJoKpC3pLmVOZ4Hn83zFOYqI8xu9bjX_y46s3jc5Ap5ginRK0hoefeM1Xfj4xILUMFJV3-JLOTgtPpoKnbs48KaEq9mEfbvyLP59URIv0j64Rc&enc=deflate)
   From the behavior, the root cause seems to be the wrong text width measurement in the Window sys.


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org