Современному менеджеру проектов необходим быстрый и удобный в использовании инструмент, который позволил бы ему управлять проектами: добавлять новые задания, устанавливать сроки для них, создавать различные отношения между установленными задачами и т.д.
Обновление от 8 октября, 2020
С выходом версии Webix 8.0, стал доступен собственный JavaScript Gantt Chart компонент. Теперь пользователи Webix могут использовать оригинальный Webix Gantt. Этот компонент создан по всем канонам Webix framework и предназначен для интеграции в любые бизнес-приложения, независимо от их архитектуры и системной платформы.
Вы можете скачать бесплатную версию Gantt, перейдя по этой ссылке. Более детальную информацию, вы можете найти на домашней странице Gantt, на странице JS Gantt документации или в каталоге примеров исходного кода Gantt.
DHTMLX Gantt Chart — это тот самый виджет, который обладает всеми вышеуказанными свойствами и не только. Для пользователей Webix у нас есть прекрасная новость: Webix может использоваться вместе с DHTMLX Gantt Chart.
Вы можете добавить DHTMLX Gantt Chart в приложение Webix при помощи всего нескольких строк кода. В результате, вы соедините функции обоих продуктов в одно удобное в использовании и быстро работающее веб-приложение.
Основные свойства Gantt:
- интуитивно понятный пользовательский интерфейс
- полная кастомизация
- сортировка и фильтрация
- гибкий API
- 3 типа связывания заданий: финиш-старт, старт-старт, финиш-финиш
Чтобы узнать больше о DHTMLX Gantt Chart, прочитайте его детальное описание.
Итак, давайте интегрируем DHTMLX Gantt Chart в ваше приложение Webix.
Во-первых, загрузите все необходимые файлы из репозитория сторонних компонентов, чтобы связать ваше приложение с этой сторонней библиотекой.
Во-вторых, вам необходимо добавить компонент Gantt в ваше приложение с помощью следующей строки кода:
В-третьих, инициализируйте view:
webix.codebase = "./components/";
webix.ui({
view:"dhx-gantt",
init:function(){...},
ready:function(){
gantt.parse(tasks); //добавление заданий
}
});
Свойства Gantt:
- init — задает функции для выполнения инициализации;
- ready — определяет функцию, которая запускается после полной загрузки компонента.
Как видите, посредством нескольких безболезненных манипуляций вы сможете добавить DHTMLX Gantt Chart в ваше приложение Webix. Это будет отличный симбиоз!
Попробуйте разработать свое веб-приложение, используя Gantt. Подробная техническая информация находится в документации Webix и DHTMLX.