Диаграмма Ганта на web

16 марта 2022, 14:00

Подскажите, каким способом лучше сделать (скриншот) подобную диаграмму? Данные должны браться из базы данных и выводиться. Видел примеры с использованием готовых скриптов, но нужно реализовать самописным кодом. Буду благодарен за направление в сторону каких-то учебных материалов, библиотек.

Заранее благодарю.

Answer 1

Любым удобным для вас способом строите сетку дней.
Оборачиваете ее в контейнер, относительно которого будете позиционировать линии диаграммы.
Выгребаете данные из базы.
Для каждой записи задаете в зависимости от значения ее полей цвет, заливку, иконку, надпись, пряжку, пуговицу, шнурок, хвост и гриву. Это будут свойства линий диаграммы.
Из полей, в которых записана конечная и начальная даты, эти даты достаете и простыми арифметическими действиями переводите в проценты.
Полученные проценты используете в качестве значений css-свойств left и right линий диаграммы.
производите все остальные желаемые действия
?????
ПРОФИТ: вы построили диаграмму Гантта на основе одного-единственного ответа на SO без того, чтобы проштудировать пару-тройку монографий на тему что это и как это сделать.