I have a progress circle that I'm implementing with react-native-svg and the white circle indicates the target progress. However, sometimes the progress exceeds 100% and I want to create a semi-circular shadow on the top of the outer progress circle to indicate the excess value. So, for instance, if a progress is 150% I want to show a semi-circular shadow on the top of the progress at 50% (the excess). I tried to do it with react-native-svg library, but filters aren't supported yet. Does anyone have an idea of how to achieve this? Any alternative solution?
An example is shown below of the expected behavior for 102%
