crossproduct / progresscircle Goto Github PK

Support some of the popular easing types, ease-in, ease-out, ease-in-out.

This will be achieved via a box shadow on the svg object using inset 0, 0, 0, strokeWidth #trackColor

Hi, your demo page seems to be broken in Firefox. Please either fix it (if it is related to your framework) or post a bug in Firefox and link the Firefox bug in this issue so others can vote the Firefox issue.

Awesome project :D Thank you!
http://crossproduct.github.io/ProgressCircle

Animate from current value to the new one, this can cause an animation as additive or degradative.

Allow the current value for percent fill to be set on an instance regardless of whether it has been drawn already or not. The duration should explicitly be 0.

Currently animations are only additive in nature and do not support any degradation, i.e. countdown. This is currently due to the way that the drawing is done, thus need to create an equally optimized way to calculate the reversal.

If you think it wise and useful...

Allow the progress circle to animate from one value to another, either forwards or backwards(ie- 50% to 20%).

The Option stopValue and Function set() indicate an integer value between 0 and 1. Aren't these really decimal (float) values between 0 and 1? e.g. 0.25, 0.50, 0.75, etc.

It's easy enough to figure out, but slightly confusing, to me anyway. I think that either the documentation should be clarified, or the code changed to actually use integers between 0 and 100.

When generating the SVG element, or drawing in general, use the "A" command for arc to. Hopefully this will allow us to gain fidelity and reduce complexity of the SVG parsing.

Implement as WebComponent