1.0.1 • Published 3 years ago

donut-chart-js v1.0.1

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

Donut Chart JS

Installation

yarn add donut-chart-js

or

npm install donut-chart-js

then

import DonutChart from 'donut-chart-js';

Usage

Create canvas element on your HTML

<canvas id="myChart" width="500px" height="500px"></canvas>

then write script

new DonutChart(document.getElementById('myChart'), {
  data: [
    { label: 'red', value: 120, color: '#F15F5F' },
    { label: 'green', value: 250, color: '#BCE55C' },
    { label: 'blue', value: 180, color: '#B2CCFF' },
    { label: 'yellow', value: 70, color: '#FFE08C' },
  ],
  holeSize: 0.6,
  animationSpeed: 0.5,
});

options

optiontypedefaultdescription
data.labelstring0The name or label of the donut.
data.valuenumber100The value of the donut.
data.colorstring50The color of the donut.
holeSizenumber0(Optional) The hole size of the donut. Use 0-1 value.
animationSpeednumber1(Optional) The speed of chart animation. Use 0-1 value.