Webix Gantt Chart overview
In early October 2020, the Webix team released the eighth version of the Webix UI library, which includes two new complex widgets. The first of them is Scheduler, which we discussed in detail in the previous article.
The second widget is the JavaScript Gantt chart, which we will discuss in detail in this article.
Webix Gantt widget review
This time, Webix has introduced us to another widget for managing resources, projects, and scheduling tasks.
Webix currently has three widgets for project management systems (Kanban, Gantt, and Scheduler)
Gantt is traditionally used for project planning and management systems based on the Waterfall methodology. The most famous solution in this area is the MS Project. Gantt charts always impress with their visual simplicity and concise visualization of the connections between tasks. The indisputable advantages of Gantt are:
- The location of tasks directly on the calendar grid.
- Visualization of working time distribution.
- Easy resource management.
- Quick search for “bottlenecks”.
- Easy project optimization due to high visibility.
Webix Gantt: system specifications
Back-end layer
Webix Gantt is shipped with NodeJS backend.
Front-end
Webix Jet based UI
5 skins: Material, Mini, Flat, Compact, Contrast
Drag-n-drop support
Documentation, API Reference, Programming samples catalog.
General impression
In this review, we will start at the end, and give a general summary. This product is vastly different from other complex Webix widgets. The first thing that catches your eye is a modest functionality. This solution does not claim to be a ready-made application, but rather a platform for developing your project and resource management systems based on the Gantt Chart core.
If you are developing a similar solution and are looking for a ready-made implementation of Gantt Chart, then Webix Gantt is exactly what you need. This is a very honest product that does not try to seem something more than just a Gantt Chart. You will have an MVP of the Gantt conception with excellent documentation and a ready-made back-end and all this is designed to be integrated into your application.
Traditionally, Webix allows you to carry out any customizations and modifications. Webix Jet technology makes it easy to upgrade the UI layer to meet the needs of your workflow.
Webix Gantt: features overview
The basic Gantt example demonstrates how to create and edit a list of tasks.
The left panel contains a hierarchical list of tasks. Each task displays a name and a start date.
You can immediately create nested tasks or root level tasks.
The right panel displays the Gantt chart itself. Thanks to drag-n-drop support, the user can:
- establish links between different tasks
- move an issue in the calendar grid
- change the duration of tasks.
When you click on a task, another panel opens where you can edit the task properties:
- name
- start date
- expiry date
- duration
- progress of execution
- related tasks
- details
Webix Gantt localization
All Webix widgets support localization. Developers can find a ready-made localization example for Gantt.
Using custom time scales
Here is another good example of using custom time scales for easier tracking of tasks. For example, using a calendar grid with a dimension of one week, month, or year.
Read-only mode
The Webix documentation offers a ready-made Gantt use case in read only mode. This view mode will be in demand for multi-user systems with different levels of access rights.
Compact mode
Gant compact mode sample will be in demand when using Gantt on screens with a small diagonal.
Conclusion
Webix Gant Chart is the youngest product in the Webix line, and it will probably evolve into an independent end-user application. But already at this stage of development, Webix users can get a convenient and beautiful Gantt Chart to develop their project and resource management application based on it.
