1.0.15 • Published 3 years ago
iamferraz-gantt-chart v1.0.15
Iamferraz Gantt Echarts
Gantt Chart using echarts
Example
Screenshot
Installation
npm install echarts -S
npm install ngx-echarts -S
npm install resize-observer-polyfill -D
npm install iamferraz-gantt-chart -S
Usage
<iamferraz-gantt
[chartTitle]="'Gantt by André'"
[dateFormat]="'{MM}/{dd}/{yyyy}'"
[(taskData)]="taskData" <!-- TaskModel[] -->
[enableDataZoom]="enableDataZoom"
[enableDarkTheme]="enableDarkTheme"
[enableGroup]="true" <!-- is to group elements? -->
(editClicked)="onEditClicked($event)"
(taskClicked)="onTaskClicked($event)" <!-- $event = TaskModel -->
[colours]="['#f00','#0f0','#00f']" <!-- task colours -->
[loading]="false" <!-- loading animation -->
[translation]="see below"
>
</iamferraz-gantt>
Translation object:
translation: any = {
DONE: "done",
TO_END: "days to finish",
DELAYED: "delayed",
FINISHED: "completed",
JANUARY : "Jan",
FEBRUARY : "Fev",
MARCH : "Mar",
APRIL : "Apr",
MAY : "May",
JUNE : "Jun",
JULY : "Jul",
AUGUST : "Aug",
SEPTEMBER : "Sep",
OCTOBER : "Oct",
NOVEMBER : "Nov",
DECEMBER : "Dec"
};
Dont forget to import the NgxEchartsModule into your app module!
import { NgxEchartsModule } from 'ngx-echarts';
@NgModule({
imports: [
...,
NgxEchartsModule.forRoot({
echarts: () => import('echarts')
})
],
})
export class AppModule { }
1.0.15
3 years ago
1.0.9
3 years ago
1.0.8
3 years ago
1.0.7
3 years ago
1.0.6
3 years ago
1.0.5
3 years ago
1.0.11
3 years ago
1.0.10
3 years ago
1.0.14
3 years ago
1.0.13
3 years ago
1.0.12
3 years ago
1.0.4
3 years ago
1.0.3
3 years ago
1.0.2
3 years ago
1.0.1
3 years ago
1.0.0
3 years ago
0.0.9
3 years ago
0.0.8
3 years ago
0.0.7
3 years ago
0.0.6
3 years ago
0.0.5
3 years ago
0.0.4
3 years ago
0.0.3
3 years ago
0.0.2
3 years ago
0.0.1
3 years ago