Manahil-Afzal opened a new pull request, #137:
URL: https://github.com/apache/echarts-examples/pull/137

   While reviewing the [Speed 
Gauge](https://github.com/apache/echarts-examples/issues/135)
    example in the ECharts editor, it was observed that the detail text (value 
and unit) sometimes overlaps with the pointer or the gauge frame, particularly 
for larger values. 
   This reduces readability and affects the overall visual presentation of the 
gauge.
   The same code pattern exists in the Progress Gauge example, meaning the 
issue could appear there as well.
   
   Steps:
   . Analyzed the issue in gauge-speed.ts to identify why the detail text 
overlaps with the pointer.
   . Confirmed that the same code structure exists in progress-gauge.ts, making 
it susceptible to the same problem.
   . Raised an [issue 
#135](https://github.com/apache/echarts-examples/issues/135)
    to track the problem.
   
   Implemented a step-by-step fix in the TypeScript file:
   
   1) Adjusted detail.offsetCenter to move the text slightly downward.
   2) Updated rich.value and rich.unit styling to properly center the value and 
unit.
   3) Verified that the text is clearly visible, centered, and no longer 
overlaps the pointer.
   
   Before:
   
![Guage](https://github.com/user-attachments/assets/3ba0e87e-b987-46f0-be5f-1937224e5d0d)
   
   => Detail text (value + unit) overlaps with the pointer or gauge frame.
   => For larger values, the value text appears too close to the pointer, 
reducing readability.
   
   After:
   ![After 
Guage](https://github.com/user-attachments/assets/c31ed4dd-53c9-440d-acd1-dc50e1152ef8)
   
   => Text is now properly centered and clearly visible.
   => No overlap with the pointer or gauge frame.
   
   Local Testing:
   . Tested on local build for the full range of values.
   . Confirmed that the fix works consistently across all values in the gauge.
   
   Impact:
   
   . Improves readability and visual clarity in the Progress Gauge example.
   . Ensures the official editor is consistent with local builds.
   . Prevents confusion caused by overlapping detail text in gauges.


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

Reply via email to