0.1.1 • Published 4 years ago
@ngx-chart/doughnut v0.1.1
@ngx-chart/doughnut
Angular library for draw doughnut charts.
Table of Contents
Installation
Install @ngx-chart/doughnut
npm i @ngx-chart/doughnut --saveDocumentation
Doughnt
Params
| param | type | description |
|---|---|---|
| values | array | Array of values to represent. |
| colors? | array | Color of segments of doughnt. If there isn't colors are applied random colors. |
| padding | boolean | Draw padding between doughnut segments. |
| labels | object | |
| labels.position | string | Set the position of labels. Allowed values are 'internal' or 'external'. |
| labels.titles | array | Array of titles of labels |
Usage:
@ app.module.ts
...
import { DoughnutGraphModule } from '@ngx-chart/doughnut-graph';
...
@NgModule({
...
imports: [
...
DoughnutGraphModule
],
...
})@ file.component.ts
...
ngOnInit() {
this.DoughnutData = {
values: [32, 24, 21, 46],
colors: ['red', 'blue', 'yellow', 'green']
};
}
...@ file.html
<ngl-doughnut
style="width: 200px; height: 100px; display: block;"
[graphData]="DoughnutData"
></ngl-doughnut>