Skip to content

Latest commit

 

History

History

sifrr-progress-round

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 
 
 
 
 
 
 

sifrr-progress-round

Usage

After loading JS file as instructed in main readme. Put this in your html file:

<sifrr-progress-round progress="47"></sifrr-progress-round>

This will render a instagram-like progres round with 47% completion. You need to set width, height with css to fit it as you need.

Stroke Theme

It always has translucent background. You can change progress stroke color and stroke-width with attribute.

Programmatic API

Change using state:

el.state = {
  progress: 34, // default 0
  stroke: '#000', // default #fff
  'stroke-width': 3 // default 2 (between 0-4)
}