Pastille

A percentage indicator chart thing for Angular

Usage

In your module:

import { PastilleModule } from 'pastille';

@NgModule({
  ...
  imports: [
    ...
    PastilleModule
    ...
  ],
  ...  
})

In your template:

<lib-pastille [data]="data"></lib-pastille>

Where data is in the following format:

data = [{
  name: 'Downloaded',
  value: 50,
  color: '#8bc34a'
}, {
  name: 'Failed',
  value: 30,
  color: '#f44336'
}, {
  name: 'Not downloaded',
  value: 20,
  color: '#cfd8dc'
}]

Development

npm start runs the example app on localhost:1337