[GitHub] [incubator-echarts] LiZ2z opened a new issue #13017: 关于笛卡尔坐标系X轴labe间隔算法问题

Thu, 23 Jul 2020 06:37:14 -0700 


LiZ2z opened a new issue #13017:
URL: https://github.com/apache/incubator-echarts/issues/13017


   ### Version
   4.8.0
   
   ### Steps to reproduce
   我需要在项目中实现如下x轴效果:
   ```
   --------------------------------  x轴线
        长
        名
        字
        .
        .
        .
   ```
   
   formatter是这样的：
   ```
   formatter: (text)=>{ 
       return `${text.split('').join('\n')}{ellipsis|.\n.\n.}`
   }
   ```
   如果让竖直的**...**的行高与普通文本一致，显然会很丑陋，所以我需要通过rich来修改它们的行高，让它们靠的近一些。
   
   
此时问题就来了，在计算label间距的函数`calculateCategoryInterval`中，是将formtter返回值当作普通文本直接检测（可能是为了性能？），而不是将rich解析出来再检测：
   
   ```
   var rect = textContain.getBoundingRect(labelFormatter(tickValue), 
params.font, 'center', 'top');
   
   // 正确的宽度检测            实际(但错误)的宽度检测
   // ------------------------------------------
   //     x                                 x
   //     x                                 x{ellipsis.
   //     .                                  .
   //     .                                  .
   //     .                             
   ```
   
   这就导致了主观上应该密集的label间隔因为错误的检测方式变得稀疏
   
   下面两种实现，主观上label间隔应该相同
   
![image](https://user-images.githubusercontent.com/30578440/88292560-5cf47080-cd2c-11ea-9960-d576359333d1.png)
   
![image](https://user-images.githubusercontent.com/30578440/88292631-785f7b80-cd2c-11ea-816a-a09b7b85a0e4.png)
   
   
   ### What is expected?
   优化宽度检测算法。或者能有什么其他实现？
   
   ### What is actually happening?
   宽度检测算法错误
   
   <!-- This issue is generated by echarts-issue-helper. DO NOT REMOVE -->
   


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

For queries about this service, please contact Infrastructure at:
[email protected]



---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to