fix(legend): Fix legend text overflow and improve layout handling

[SchnWalter]

Brief Information

This pull request is in the type of:

• bug fixing
• new feature
• others

What does this PR do?

Improve the overall user experience by ensuring legends are displayed properly, avoiding overflow issues with lengthy item labels or limited space.

Additionally, a new test has been provided to demonstrate and verify the changes by comparing the behavior before and after applying the changes.

Fixed issues

• [Bug] Plain legend label overflows container if text is too long #20237: [Bug] Plain legend label overflows container if text is too long

Details

Before: What was the problem?

The legend has a width of 128px and the overflow is configured to break words, but it doesn't do anything.

After: How does it behave after the fixing?

The legend item text overflow is working correctly.

Document Info

One of the following should be checked.

• 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

ZRender Changes

• This PR depends on ZRender changes (ecomfe/zrender#xxx).

Related test cases or examples to use the new APIs

• test/legend-overflow.html

Others

Merging options

• Please squash the commits into a single one when merging.

Other information

[echarts-bot]

Thanks for your contribution!
The community will review it ASAP. In the meanwhile, please checkout the coding standard and Wiki about How to make a pull request.

[github-actions]

The changes brought by this PR can be previewed at: https://echarts.apache.org/examples/editor?version=PR-20967@ed9013d

[echarts-bot]

Congratulations! Your PR has been merged. Thanks for your contribution! 👍

[100pah]

If legend is layout horizontally, the "break" effect would be wrong.
And if the text has textStyle.backgroundColor, the effect would be broken by this change, since textStyle.width is shared by backgroundColor and overflow currently.

I think this feature currently can only serve for vertical layout.
And set width only if overflow: 'truncate' | 'break' | 'breakAll', for textStyle.backgroundColor` compromise.

And zrender need upgrade to support a more wise setting about text width, like maxWidth.

[Ovilia]

OK. Let's leave this to the next version.