Как визуализировать время нахождения сотрудника в онлайн?

Question

[Денис Щербина]

Фиксирую время, в которое сотрудник был онлайн, (записываю в бд время появление в сети и время выхода из сети). Например:
с 9:32 по 9:55,
с 11:22 по 14:00
и тд.
Хотел бы визуализировать, когда сотрудник был онлайн - чтобы все промежутки времени отображались в какой-нибудь диаграмке или на графике, или на таймлинии. Пример того, что представляю, прикрепляю. На рисунке рабочий день - с 9:00 до 18:00, в виде тайм-линии. На нём отображается промежутки, когда конкретный сотрудник находился онлайн.
Есть у кого-нибудь рекомендации, как это загуглить, готовые решения, или может похожие варианты? Предварительно, использую angular.js с 'ng2-charts'. Обычный график наверное не подойдёт, поскольку слишком много промежуточных точек между двумя временными промежутками...

Comments

[Антон Швец]

Это ж просто несколько div в ряд

[Денис Щербина]

Антон Швец, Тогда нужно эти div расставить в соответствии с временным интервалом таймлинии, подогнать размеры, вообщем много всего.. Хочу найти какое-нибудь готовое решение

[Антон Швец]

Денис Щербина, просто временные интервалы в проценты переводишь и выставляешь как ширину.

[Денис Щербина]

Антон Швец, Это хорошая идея, спасибо) Но нужно развить мысль.. Как получившиеся блоки разместить? Вернее как узнать их точку отсчёта.. Допустим известен интервал времени, с 9 до 18 рабочий день, он заходил с 11:40 до 12:10

[Антон Швец]

Денис Щербина, два варианта. либо весь день забивается блоками - свободен и занят, либо просто позиционируешь абсолютно по тем же процентам.