Strange "shaking" behaviour for coordinateSystem + roundCap bar charts for higher than 100% percent values
Describe the bug When creating a polar coordinateSystem bar chart with roundCap set to true for a value on the series, that dataset will appear to shake during animation.
To Reproduce Steps to reproduce the behavior:
- Create a simple react-native-echarts skeleton bar chart
- Modify the series to include
coordinateSystem: 'polar'androundCap: true - Include a data value in the series higher than the max value specified in
angleAxis.max: 100such asdata: [140] - Ensure animations are enabled
- Load the graph
Expected behavior The animation reaches it's final destination without causing the element to shake.
Screenshots/Videos iOS
https://github.com/wuba/react-native-echarts/assets/54673427/5900b584-04f4-4117-807e-9f9ff272ef3f
Android
https://github.com/wuba/react-native-echarts/assets/54673427/e6a78ab5-73c4-4c49-9308-03bea088361e
Smartphone (please complete the following information):
-
Device: iPhone 12 Pro Max
-
OS: iOS 16.6
-
Browser: Safari
-
Versions: "@wuba/react-native-echarts": "^1.2.4", "echarts": "^5.4.3",
-
Device: Android Emulator (Pixel 5 API 30)
-
OS: Android 11.0 Google APIs
-
Browser N/A
-
Versions: "@wuba/react-native-echarts": "^1.2.4", "echarts": "^5.4.3",
Additional context This appears to occur across iOS/Android/Web on both Skia and SVG. But does not seem to happen on the non react-native library. If there are any suggestions/alternatives methods for a better way to create this style of graph that can replicate the second snack that would be fantastic.
Expo Snacks: (animationDuration can be changed but the issue still occurs) https://snack.expo.dev/@davidtjones/6ffc24 https://snack.expo.dev/@davidtjones/close-to-production-example
Apache ECharts Example (Not experiencing the problem here): Apache ECharts example
Thank you very much for working on this library, it works incredibly well. If I can provide any more information I'll be happy to help.
Any info on this?