radial-progress-chart

A customizable Radial Progress Chart written on the top of D3.js.

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
radial-progress-chart
93140.0.48 years ago9 years agoMinified + gzip package size for radial-progress-chart in KB

Readme

Radial Progress Chart
Radial Progress Chart started as a weekend project. It’s written on the top of D3.js and was heavily inspired by Apple Watch Activity and D3 stub of Polar Clock

Features

I tried to make it highly customizable for serve multiple purposes. Some of the features available are:
  • Add many progress rings as you want
  • Place static or dynamic text in the center
  • Customize diameter, stroke width, gap, colors
  • CSS customizable
  • Chart data can be update
  • 275 bytes minified & gzipped

Dependencies

D3.js = ^3.5.0

Demo

Check out project page http://pablomolnar.github.io/radial-progress-chart

Installation

Download the latest version from Github or use your favorite package manager to include it in your project.
$ npm install radial-progress-chart

$ bower install radial-progress-chart

$ component install pablomolnar/radial-progress-chart

$ spm install radial-progress-chart
Check out project page http://pablomolnar.github.io/radial-progress-chart

API & Usage

Check out project page http://pablomolnar.github.io/radial-progress-chart

Browser Support

  • Modern browsers (Chrome, Firefox, Safari, Opera, iOS, Android)
  • IE9+

Contribution

Sure, pull request are welcome. Build the project locally using the following steps:
$ npm install
$ npm run-script build
Remember to test and hint your code with:
$ npm test
$ npm run-script hint    

Publishing

  • Bump version
  • Tag vX.X.X
  • npm version patch
  • spm publish

License

This library is free and open source software, distributed under the MIT License. Copyright © 2015 Pablo Molnar @pmolnar;