You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2022/04/22 03:18:13 UTC

[GitHub] [echarts] leekbillow opened a new issue, #16931: [Feature] x轴标签间隔问题(xAxis.axisLabel.interval)question

leekbillow opened a new issue, #16931:
URL: https://github.com/apache/echarts/issues/16931

   ### What problem does this feature solve?
   
   希望x轴标签间距的自动计算可以把宽度设置考虑进去,否则即使`xAxis.axisLabel.width`设置得很小,依然会有标签不显示浪费空间。
   It is hoped that the automatic calculation of the X-axis label spacing takes into account the width Settings, otherwise even if `xAxis.axisLabel.width` is set very small, there will still be labels that do not display wasted space.
   ```js
   option = {
     xAxis: {
       type: 'category',
       data: [
         '标签标签标签标签标签标签标签',
         '标签标签标签标签标签',
         '标签标签标签',
         '标签标签标签标签标签',
         '标签标签标签',
         '标签标签标签标签标签标签标签标签标签标签标签',
         '标签标签',
         '标签标签标签标签'
       ],
       axisLabel: {
         width: 50,
         overflow: 'truncate',
         // interval: 0
       }
     },
     // dataZoom: {
     yAxis: {
       type: 'value'
     },
     series: [
       {
         type: 'bar',
         data: [120, 200, 150, 80, 70, 110, 130, 200]
       }
     ]
   };
   ```
   ![image](https://user-images.githubusercontent.com/43409097/164588677-9e874c4b-6332-4fe7-8693-acaa93b3195e.png)
   
   
   ### What does the proposed API look like?
   
   `xAxis.axisLabel.interval='auto'`


-- 
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.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


[GitHub] [echarts] jiawulin001 commented on issue #16931: [Feature] x轴标签间隔问题(xAxis.axisLabel.interval)question

Posted by GitBox <gi...@apache.org>.
jiawulin001 commented on issue #16931:
URL: https://github.com/apache/echarts/issues/16931#issuecomment-1105979250

   我不明白你想要达成的效果是否为展示所有label?当label中有label较长的时候会影响label的自动展示。我看到你有使用`xAxis.axisLabel.interval: 0`,这个可以展示所有的label,是否能够达成你想要的效果?能否详细描述一下你需要什么效果?
   I don't know if what you try to achieve is to display all labels. When one of the labels is too long, it will affect auto distribution of labels. I see that you had used (commented) `xAxis.axisLabel.interval: 0`, which can display all labels. Why couldn't it help you with your goal? Can you give more details about your goal?


-- 
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


[GitHub] [echarts] leekbillow commented on issue #16931: [Feature] x轴标签间隔问题(xAxis.axisLabel.interval)question

Posted by GitBox <gi...@apache.org>.
leekbillow commented on issue #16931:
URL: https://github.com/apache/echarts/issues/16931#issuecomment-1106048131

   > 我不明白你想要达成的效果是否为展示所有label?当label中有label较长的时候会影响label的自动展示。我看到你有使用`xAxis.axisLabel.interval: 0`,这个可以展示所有的label,是否能够达成你想要的效果?能否详细描述一下你需要什么效果? I don't know if what you try to achieve is to display all labels. When one of the labels is too long, it will affect auto distribution of labels. I see that you had used (commented) `xAxis.axisLabel.interval: 0`, which can display all labels. Why couldn't it help you with your goal? Can you give more details about your goal?
   
   例如上图,`xAxis.axisLabel.width`已经设置得很窄了,按理来说x轴标签应该全部展示出来(在自动计算的情况下),但实际上标签间隔是2,希望自动计算间隔可以改进一下,在`xAxis.axisLabel.width`设置得很窄得时候,不需要`xAxis.axisLabel.interval: 0`强制展示也能计算出理想的结果,在`datazoom`变化时,自动隐藏看起来会更合理。
   For example, the 'xAxis.axisLabel.width' has been set to a very narrow width.   Normally the x-axis labels should be displayed in full (in the case of automatic calculation), but in fact the label spacing is 2.   Hopefully the automatic calculation spacing can be improved.    When `xAxis.axislabel.width` is set very narrow, the desired result can be computed without the 'xAxis.axisLabel.interval: 0' mandatory display, when the 'Datazoom' changes, autohiding looks more reasonable.


-- 
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


[GitHub] [echarts] leekbillow commented on issue #16931: [Feature] x轴标签间隔问题(xAxis.axisLabel.interval)question

Posted by GitBox <gi...@apache.org>.
leekbillow commented on issue #16931:
URL: https://github.com/apache/echarts/issues/16931#issuecomment-1106048590

   > 我不明白你想要达成的效果是否为展示所有label?当label中有label较长的时候会影响label的自动展示。我看到你有使用`xAxis.axisLabel.interval: 0`,这个可以展示所有的label,是否能够达成你想要的效果?能否详细描述一下你需要什么效果? I don't know if what you try to achieve is to display all labels. When one of the labels is too long, it will affect auto distribution of labels. I see that you had used (commented) `xAxis.axisLabel.interval: 0`, which can display all labels. Why couldn't it help you with your goal? Can you give more details about your goal?
   
   例如上图,`xAxis.axisLabel.width`已经设置得很窄了,按理来说x轴标签应该全部展示出来(在自动计算的情况下),但实际上标签间隔是2,希望自动计算间隔可以改进一下,在`xAxis.axisLabel.width`设置得很窄得时候,不需要`xAxis.axisLabel.interval: 0`强制展示也能计算出理想的结果,在`datazoom`变化时,自动隐藏看起来会更合理。
   For example, the 'xAxis.axisLabel.width' has been set to a very narrow width.   Normally the x-axis labels should be displayed in full (in the case of automatic calculation), but in fact the label spacing is 2.   Hopefully the automatic calculation spacing can be improved.    When `xAxis.axislabel.width` is set very narrow, the desired result can be computed without the 'xAxis.axisLabel.interval: 0' mandatory display, when the 'Datazoom' changes, autohiding looks more reasonable.


-- 
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


[GitHub] [echarts] echarts-bot[bot] commented on issue #16931: [Feature] x轴标签间隔问题(xAxis.axisLabel.interval)question

Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #16931:
URL: https://github.com/apache/echarts/issues/16931#issuecomment-1105961769

   @leekbillow 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. 🤗
   <details><summary><b>TRANSLATED</b></summary><br>
   
   **TITLE**
   
   [Feature] x-axis label interval problem (xAxis.axisLabel.interval)question
   
   **BODY**
   
   ### What problem does this feature solve?
   
   I hope the automatic calculation of the x-axis label spacing can take the width setting into account, otherwise even if `xAxis.axisLabel.width` is set very small, there will still be labels that are not displayed and waste space.
   It is hoped that the automatic calculation of the X-axis label spacing takes into account the width Settings, otherwise even if `xAxis.axisLabel.width` is set very small, there will still be labels that do not display wasted space.
   ````js
   option = {
     xAxis: {
       type: 'category',
       data: [
         'label label label label label label label label',
         'tag tag tag tag tag',
         'label label label',
         'tag tag tag tag tag',
         'label label label',
         'label label label label label label label label label label label label label label',
         'label label',
         'label label label label'
       ],
       axisLabel: {
         width: 50,
         overflow: 'truncate',
         // interval: 0
       }
     },
     // dataZoom: {
     yAxis: {
       type: 'value'
     },
     series: [
       {
         type: 'bar',
         data: [120, 200, 150, 80, 70, 110, 130, 200]
       }
     ]
   };
   ````
   ![image](https://user-images.githubusercontent.com/43409097/164588677-9e874c4b-6332-4fe7-8693-acaa93b3195e.png)
   
   
   ### What does the proposed API look like?
   
   `xAxis.axisLabel.interval='auto'`
   </details>


-- 
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


[GitHub] [echarts] linghaoSu commented on issue #16931: [Feature] x轴标签间隔问题(xAxis.axisLabel.interval)question

Posted by GitBox <gi...@apache.org>.
linghaoSu commented on issue #16931:
URL: https://github.com/apache/echarts/issues/16931#issuecomment-1114409043

   当前的 auto 的模式取得是最长标签的宽度,然后轴空间的**总长度** 除以 这个**最大宽度** 计算的得到的间隔。因此与直观理解的重叠隐藏逻辑不太一致(我个人理解的 auto 模式也许是逐个寻找能完整显示的标签,而不是通过最大宽度计算出一个固定间隔?)
   
   PS:`overflow: 'truncate'` 模式开了也就没必要做自动间隔的计算了吧?(x
   
   
   The current auto mode takes the width of the longest label, and then divides the **total length** of the axis space by the **max width** calculated interval. Therefore, it is not consistent with the intuitively understood overlapping hiding logic (my personal understanding of the auto mode may be to find the labels that can be completely displayed one by one, instead of calculating a fixed interval through the maximum width?)
   
   PS: `overflow: 'truncate'` mode is on, so there is no need to do automatic interval calculation? (x
   
   https://github.com/apache/echarts/blob/master/src/coord/axisTickLabelBuilder.ts#L255-L278


-- 
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


[GitHub] [echarts] leekbillow commented on issue #16931: [Feature] x轴标签间隔问题(xAxis.axisLabel.interval)question

Posted by GitBox <gi...@apache.org>.
leekbillow commented on issue #16931:
URL: https://github.com/apache/echarts/issues/16931#issuecomment-1118326918

   @linghaoSu 是的,你明白我的意思,即使设置了固定宽度,自动计算间隔仍然使用最长的label作为计算参考;
   `overflow: 'truncate'`后,可以自己算好间隔然后`interval: 0`,但是如果同时使用datazoom的话就不太够用了,它不会自动隐藏。
   
   Yes, you see what I mean, even with a fixed width, the automatic calculation interval still uses the longest label as the calculation reference; After `overflow: 'truncate'`, you can calculate the interval and then `interval: 0`, but it is not enough if you use datazoom at the same time, does not automatically hide. 
   ```js
   option = {
     xAxis: {
       type: 'category',
       data: [
         '标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签',
         '标签标签标签标签标签标签标签标签标签标签',
         '标签标签标签标签标签标签',
         '标签标签标签标签标签标签标签标签标签标签',
         '标签标签标签标签标签标签',
         '标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签标签',
         '标签标签',
         '标签标签标签标签标签标签标签标签'
       ],
       axisLabel: {
         width: 250,
         overflow: 'truncate',
         interval: 0
       }
     },
     dataZoom: {
       startValue: 0,
       endValue: 3
     },
     yAxis: {
       type: 'value'
     },
     series: [
       {
         type: 'bar',
         data: [120, 200, 150, 80, 70, 110, 130, 200]
       }
     ]
   };
   ```
   ![动画](https://user-images.githubusercontent.com/43409097/166891721-76e079a3-1dea-4900-8b9d-892ee2c98d41.gif)
   
   


-- 
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: [I] [Feature] x轴标签间隔问题(xAxis.axisLabel.interval)question [echarts]

Posted by "github-actions[bot] (via GitHub)" <gi...@apache.org>.
github-actions[bot] commented on issue #16931:
URL: https://github.com/apache/echarts/issues/16931#issuecomment-2094397048

   This issue has been automatically marked as stale because it did not have recent activity. It will be closed in 7 days if no further activity occurs. If you wish not to mark it as stale, please leave a comment in this issue.


-- 
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