apache / echarts

Apache ECharts is a powerful, interactive charting and data visualization library for browser
https://echarts.apache.org
Apache License 2.0
60.6k stars 19.62k forks source link

[Feature] 类目标签支持自动检测标签长度而选择标签倾斜显示 #18664

Open mtrdong opened 1 year ago

mtrdong commented 1 year ago

What problem does this feature solve?

有时类目的数量,或着类目名称都可能时变化的。例如统计学生们对每节各个知识点的掌握情况,其中知识点作为X轴类目,名称和数量都是变化的。我希望显示所有知识点,又不想它们重叠,这时就需要自动检测知识点名称的长度,设置名称过长时的显示方式。而不是只能设置倾斜显示,或者使用回调函数。这样将显得更加智能和人性化,体验更好

What does the proposed API look like?

当设置xAxis.axisLabel.interval=0时,毫无疑问,我们是不可能希望标签名称重叠的。这时要么设置xAxis.axisLabel.rotate使标签始终倾斜显示,要么通过回调函数换行标签名称,大多数人也是这么做的,这样的体验并不好,也许我们可以允许设置xAxis.axisLabel.rotate='auto',当设置xAxis.axisLabel.interval=0xAxis.axisLabel.rotate='auto'时,如果标签名称过长,默认按45度倾斜显示;当设置xAxis.axisLabel.interval=0且使用了回调函数,则在参数中加入标签是否过长的标识。如此一来,对于类目标签名称的处理将更加灵活

echarts-bot[bot] commented 1 year ago

@mtrdong It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people and get helped, we'd like to suggest using English next time. 🤗

TRANSLATED
**TITLE** The [Feature] class target tag supports automatic detection of the label length and selection of the label to be tilted instead of just hiding part of the label **BODY** ### What problem does this feature solve? Sometimes the number of categories, or the category names may change from time to time. For example, to count the students' mastery of each knowledge point in each section, where the knowledge points are used as the X-axis category, and the name and quantity are changed. I want to display all the knowledge points, but I don't want them to overlap. At this time, I need to automatically detect the length of the knowledge point name and set the display method when the name is too long. Instead of only setting the tilt display, or using a callback function. In this way, it will appear more intelligent and humanized, and the experience will be better ### What does the proposed API look like? When setting `xAxis.axisLabel.interval=0`, there is no doubt that it is impossible for us to want the label names to overlap. At this time, either set `xAxis.axisLabel.rotate` so that the label is always displayed at an angle, or use a callback function to wrap the label name. Most people do this too. This kind of experience is not good. Maybe we can allow setting `xAxis.axisLabel. rotate='auto'`, when setting `xAxis.axisLabel.interval=0` and `xAxis.axisLabel.rotate='auto'`, if the label name is too long, it will be displayed at 45 degrees by default.