Skip to content

Circular progress widget, dependency-free and configurable.

Notifications You must be signed in to change notification settings

iGitK72/circular-progress

This branch is 2 commits behind gregberge/circular-progress:master.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

be5c9ec · Jul 5, 2013

History

11 Commits
Apr 25, 2013
Apr 29, 2013
Apr 29, 2013
Jun 14, 2013
Jul 5, 2013
Jul 5, 2013
Jul 5, 2013
Jul 5, 2013
Jul 5, 2013

Repository files navigation

Circular Progress

A JavaScript circular progress widget, dependency-free and configurable.

Example

Example

var progress = new CircularProgress({
  radius: 70,
  strokeStyle: 'black',
  lineCap: 'round',
  lineWidth: 4
});

document.body.appendChild(progress.el);

progress.update(40);

Usage

new CircularProgress( options )

Other attributes are attached to the canvas 2D context.

Options :

  • all 2D context properties.
  • text : Scopped to text, accept value and all 2D context properties.
  • initial : Scopped to initial circle, accept all 2D context properties.

Example :

progress = new CircularProgress({
  lineWidth: 2,
  initial: {
    strokeStyle: 'gray',
    lineWidth: 4
  }
});

// update options
progress.options.text = {
  font: '14px'
};

update( value )

Update percent and draw the canvas, value must be a float between 0 and 100.

License

MIT

About

Circular progress widget, dependency-free and configurable.

Resources

Stars

Watchers

Forks

Packages

No packages published