RexSkz opened a new pull request, #19056: URL: https://github.com/apache/echarts/pull/19056
<!-- Please fill in the following information to help us review your PR more efficiently. --> ## Brief Information This pull request is in the type of: - [x] bug fixing - [ ] new feature - [ ] others ### What does this PR do? <!-- USE ONE SENTENCE TO DESCRIBE WHAT THIS PR DOES. --> Take `devicePixelRatio` into account when extending the clip path. ### Fixed issues - #19051 ## Details ### Before: What was the problem? <!-- DESCRIBE THE BUG OR REQUIREMENT HERE. --> <!-- ADD SCREENSHOT HERE IF APPLICABLE. --> As the example https://codepen.io/rexskz/pen/WNLweyw shows, the rightmost position of the line that has `cap: 'round'` is clipped incorrectly, while the leftmost part is okay. <img width="458" alt="image" src="https://github.com/apache/echarts/assets/27483702/b8a17de7-b83a-466d-a401-82e1639ea936";> This issue only happens on the device with `devicePixelRatio >= 3`, and the chart canvas must have a special width. ### After: How does it behave after the fixing? <!-- THE RESULT AFTER FIXING AND A SIMPLE EXPLANATION ABOUT HOW IT IS FIXED. --> <!-- ADD SCREENSHOT HERE IF APPLICABLE. --> The rightmost position of the line should not be clipped. <img width="563" alt="image" src="https://github.com/apache/echarts/assets/27483702/0b7ab4b8-b3a3-44e7-9a77-1449285455f2";> Because the previous code doesn't consider the `devicePixelRatio`, it may result in some float with the decimal part less than 0.5 (not the round-off error): <img width="522" alt="image" src="https://github.com/apache/echarts/assets/27483702/52936e58-afa9-4801-a0a7-02f841e4238c";> After multiplying `devicePixelRatio`, there're only round-off errors, which will be corrected by the `Math.round` later. P.S. During the visual test, I found that some cases may also be clipped incorrectly before, and will be corrected in this PR, for example: <img width="1252" alt="image" src="https://github.com/apache/echarts/assets/27483702/f0bc2bfb-2697-4664-bd29-62f1c9e00f57";> <img width="1270" alt="image" src="https://github.com/apache/echarts/assets/27483702/8140270a-c29d-4e50-93c7-c63cefd96000";> ## Document Info One of the following should be checked. - [x] This PR doesn't relate to document changes - [ ] The document should be updated later - [ ] The document changes have been made in apache/echarts-doc#xxx ## Misc ### ZRender Changes - [ ] This PR depends on ZRender changes (ecomfe/zrender#xxx). ### Related test cases or examples to use the new APIs N.A. ## Others ### Merging options - [ ] Please squash the commits into a single one when merging. ### Other information -- 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-unsubscr...@echarts.apache.org For queries about this service, please contact Infrastructure at: us...@infra.apache.org --------------------------------------------------------------------- To unsubscribe, e-mail: commits-unsubscr...@echarts.apache.org For additional commands, e-mail: commits-h...@echarts.apache.org
