meganthecoder opened a new issue, #21397: URL: https://github.com/apache/echarts/issues/21397
### What problem does this feature solve? This allows developers to adjust the `letter-spacing` and `word-spacing` properties without the legend text overlapping with the icon. A developer might need to set these styling properties because of the designs they were given or they might need to support it for WCAG accessibility compliance (1.4.12 Text Spacing [Level AA] – WCAG 2.1). The following screenshot shows how the legend text overlaps with the icon if you try to change the `letter-spacing` and `word-spacing` properties outside of echarts: <img width="1919" height="968" alt="Image" src="https://github.com/user-attachments/assets/3841f7b4-6a14-49be-a942-e8ab39ca3e76" /> You can recreate the right side of the screenshot by using the [Text Spacing Editor](https://chromewebstore.google.com/detail/text-spacing-editor/amnelgbfbdlfjeaobejkfmjjnmeddaoj) chrome extension on the [stacked area chart](https://echarts.apache.org/examples/en/editor.html?c=area-stack) example page. This could be solved by supporting the `letter-spacing` and `word-spacing` properties in the legend textStyle options. ### What does the proposed API look like? ``` setOption({ legend: { textStyle: { letterSpacing: 'normal', // should support em values and px values as well wordSpacing: 'normal', // should support em values and px values as well }, }, }) ``` The legend would need to take these properties into consideration when calculating the size of each item. -- 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: [email protected] For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
