[GitHub] [echarts] echarts-bot[bot] commented on issue #16851: [Bug] grid.top=xx%+series.type=scatter 在不同的浏览器窗口大小下可能不显示最高点

[GitBox]

echarts-bot[bot] commented on issue #16851:
URL: https://github.com/apache/echarts/issues/16851#issuecomment-1092391048

   @zyuelei 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**
   
   [Bug] grid.top=xx%+series.type=scatter may not display the highest point at 
different browser window sizes
   
   **BODY**
   
   ### Version
   
   5.3.2
   
   ### Link to Minimal Reproduction
   
   _No response_
   
   ### Steps to Reproduce
   
   `option = {
     tooltip: {
       trigger: 'axis'
     },
     grid: [
       {
         left: '0%',
         top: '10%', // just change it to a number instead of a percentage
         width: '50%',
         height: '48%',
         containLabel: true
       }
     ],
     xAxis: [
       {
         type: 'time'
       }
     ],
     yAxis: [
       {
         type: 'value'
       }
     ],
     series: [
       {
         data: [
           ['2022-04-08 08:25:06', 1],
           ['2022-04-08 08:30:10', 2],
           ['2022-04-08 08:35:16', 3],
           ['2022-04-08 08:53:55', 4]
         ],
         type: 'scatter'
       }
     ]
   };
   `
   
   // Copy the code to the official example and replace it
   
   ### Current Behavior
   
   I need to customize four grids, and then the code of the grid in the upper 
left corner is above. When dragging the browser window to zoom, the highest 
point may not be displayed.
   However, using pixels as the top value cannot meet the requirements. The 
percentage can ensure that when the user zooms the browser window, multiple 
grids will not overlap.
   
   ### Expected Behavior
   
   
![image](https://user-images.githubusercontent.com/13957066/162353119-f942d71e-0448-4755-bbba-aca60e46281e.png)
   
![image](https://user-images.githubusercontent.com/13957066/162353402-224850e0-3cd8-4433-8440-06f257466e3c.png)
   
   
   ### Environment
   
   ````markdown
   - OS: Mac M1 and UOS
   - Browser: Chrome 100
   - Framework: Angular13 + Ant
   ````
   
   
   ### Any additional comments?
   
   _No response_
   </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: dev-unsubscr...@echarts.apache.org

For queries about this service, please contact Infrastructure at:
us...@infra.apache.org


---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscr...@echarts.apache.org
For additional commands, e-mail: dev-h...@echarts.apache.org