I've been exploring available chart libraries to use with react js though none seem to match my criteria. 

I need to be able to set gradients within the chart, set "average" points hence the small dots within the doughnut. 

The text I figured I can overlay to create the desired affect. 

Chart.js I could get close however, there was not enough documentation to provide examples on how to execute gradients within the doughnut. 

With going down a Canvas custom route as a complete last resort, are there any libraries that could provide what I'm looking for based on my design? 

[![enter image description here](https://i.stack.imgur.com/MjAt4.png)](https://i.stack.imgur.com/MjAt4.png)