kottenator/jquery-circle-progress

Is it possible to arcFill with gradient?

Closed this issue · 1 comments

thebradhimself commented

Hello,

I am drawing an Arc and when it is at 100% I want a pretty heavy black gradient at the bottom.
As the progress goes down to 0% I need the gradient to slowly reduce.

I found a snippet you made using arcFill to calculate the color based on the stepValue using HSL.
( instance.arcFill = 'hsl(' + 120 * stepValue + ', 75%, 50%)'; )

Is it possible to also apply a gradient to arcFill?

I can mostly get what I need using instance.fill { gradient: ['black', 'red'], gradientAngle: some angle }.
I can't get it to work if I use instance.fill { gradient: [['#31a51c', 1.0], ['black', .6]] }.

I really like how smooth the transitions are using arcFill and hsl. Is it possible to apply a gradient to that?
Or can you recommend me a good way to approach this issue?

Thank you!

thebradhimself commented

I decided to apply my own gradient on top of the progress bar and adjust it based on stepValue.