ngx-gantt

!npm bundle size (scoped)

A modern and powerful gantt component for Angular

Note about this project

This project is a fork of ``https://github.com/worktile/ngx-gantt.git` with the following changes:
- The start of the week is Sunday and not Monday
- The format of the dates have been updated from `MM-dd-yyyy` to `dd.MM.yyyy`
- There are 4 new time resolutions (for a total of 9 resolutions): `Hour`, `30-Minutes`, `5-minutes` , `1-Minute`
- The original project was in Chinese, this fork has been translated to English

Installation

`bash
$ npm i @tchvu3/angular-gantt --save


or


$ yarn add @tchvu3/angular-gantt
`

Demo

Try the live demo (The original Chinese example site)

Usage

$3

`ts
import { NgModule } from '@angular/core';
import { NgxGanttModule } from '@tchvu3/angular-gantt';

@NgModule({
...
imports: [ NgxGanttModule, ... ]
...
})
export class AppModule {

}
`

$3

`json
{
"styles": ["node_modules/@tchvu3/angular-gantt/main.bundle.scss"]
}
`

`scss
@import '~@tchvu3/angular-gantt/main.bundle.scss';
`

$3

component.html

`html



{{ item.title }}



`

component.ts

`javascript
@Component({
selector: 'app-gantt-example',
templateUrl: './gantt.component.html'
})
export class AppGanttExampleComponent {
items: GanttItem[] = [
{ id: '000000', title: 'Task 0', start: 1627729997, end: 1628421197 },
{ id: '000001', title: 'Task 1', start: 1617361997, end: 1625483597 }
];

constructor() {}
}
`

See Getting Started for more details.

Development

`bash
$ git clone https://github.com/tchvu3/ngx-gantt.git
$ cd ngx-gantt
$ npm install
$ npm run start
``

LICENSE

MIT License