Status
FillDonut plugin for Chartist.js
This plugin provides a hacky way to fill a donut before the animation will start. Also on board is a way to add multiple html or text elements to the Donut on different positions. Plugin will just work with Chartist Pie charts.
Please visit http://gionkunz.github.io/chartist-js/plugins.html for more information.
FillDonut plugin installation
bower install chartist-plugin-fill-donut --save
npm install chartist-plugin-fill-donut --save
manual
download https://github.com/moxx/chartist-plugin-fill-donut/archive/master.zip
-> search the dist folder for needed js files
Available options and their defaults
var defaultOptions = fillClass: 'ct-fill-donut' label : html: '<div class="ct-fill-donut-label"></div>' items : class : '' id: '' content : 'fillText' position: 'center' //bottom, top, left, right offsetY: 0 //top, bottom in px offsetX: 0 //left, right in px ;
Sample usage in Chartist.js
bower install chartist-plugin-fill-donut --save
Example:
var chart = '#chart-e1' series: 160 60 labels: '' '' donut: true donutWidth: 20 startAngle: 210 total: 260 showLabel: false plugins: Chartistplugins ; //Animation for the first series chart;
Needs to be styled
/*make a color different to fill-donut series*/ /*make b hidden*/ /*make all fill-donut series visible and set color*/
License
The FillDonut plugin for Chartist is open-sourced software licensed under the MIT license.