1.2.0 • Published 6 years ago
ys-pie v1.2.0
YsDashboard
This component is only for angular N
framework, not for angularJS
Demo Page (I use htmlpreview to show the page, so it may take some time to load the page.)
Pie / Spin / Speed / Measure UI
Required Libs
- @angular/core
- @angular/common
Usage
1. Import module
import { YsPieModule } from 'ys-pie';
@NgModule({
declarations: [
AppComponent
],
imports: [
YsPieModule,
BrowserModule,
],
providers: [],
bootstrap: [AppComponent]
})
2. Use component
<ys-pie [size]="100" [percentage]="20" [direction]="'top'" [color]="'#23a7d7'" [label]="20"></ys-pie>
API Document
Attribute | Type | Description |
---|---|---|
size | integer number | The size of the component. It will change both height and width with same value. |
percentage | number (0-100) | The UI will be filled color based on the percentage. |
color | Hex Color Codes | Define a filled color. |
label | string | The label will be showed on the center of UI |
direction | string: bottom top | The start point will be bottom or top . |