I'm working on a multiple level doughnut chart and I'm trying to make the colors of the two sets of data blend in at the borders within each ring and I'm not sure if it's even possible.

I'll be using dynamic data in the chart. I added radial gradient colors to two of the datasets but that's not what I need because it's using the whole canvas so the gradient continues from one dataset to another and I need a separate one for each dataset.

I need the Data2 part to be blue and the Data1 to be red and for them to just blend near the border.

I also tried using a gradient plugin but it seems that it's not working on doughnut charts.

I'm using the React wrapped Chartjs version btw.

Here is the chart in question:
https://codesandbox.io/s/sharp-leftpad-ls98m?file=/src/charts/doughnut.js

Any help would be appreciated!