Angle gradient in canvas

Question

I\'m looking for a code that permits to have this effect on a canvas\' stroke. I\'ve already got an animated circular stroke, I only need to get the ANGLE gradient, not line

Answer 1

I needed this effect, too a few days ago, and I have managed to create a workaround to achieve it.

What I did was overlay one gradient over the other using something like this:

var ic = [
      /*0*/{ a:"#FEC331" ,b:"#FB1E24"     ,r1:0   ,r2:1   ,x0:0   ,y0:rd*0.5 ,x1:0  ,y1:-rd},
      /*1*/{ a:"#FEC331" ,b:"#FB1E24"     ,r1:0.5 ,r2:0.5 ,x0:0   ,y0:rd*0.3 ,x1:0  ,y1:-rd},
      /*2*/{ a:"#EA6F2B" ,b:"transparent" ,r1:0   ,r2:1   ,x0:-rd ,y0:0      ,x1:rd ,y1:0  }
  ];

Here's the complete code and demo in JSFiddle:

https://jsfiddle.net/flamedenise/n9no9Lgw/33/

Hope it helps.