Диаграмма TimeLine. Этапы маршрута на шкале времени

02.01.19

Разработка - Работа с интерфейсом

Визуализация цифровых данных помогает скорейшему усвоению информации и принятию своевременных решений. Конечно, приведённые данные не будут критичны к отображению по времени, но дают наглядное представление и помогают выявить узкое горлышко в бизнес-процессе. Для примера отразим поход Дерсу Узала по уссурийскому краю МЫ.

Скачать файлы

Наименование Файл Версия Размер
Диаграмма TimeLine! Этапы маршрута на шкале времени. (Поход Дерсу):
.epf 14,72Kb
3
.epf 14,72Kb 3 Скачать

Задал мне Дерсу задачку, хочет он видеть на графике маршрута, где же он отставания допускал. Передал мне таблички с данными на вход: 

  1. Данные по маршруту: Дата, Название точки
  2. Норматив по времени между двух точек, Описание действия между этими точками

В дополнение к графику быстро и непринуждённо получаем сводную таблицу, объясняющую Вам всю суть бизнес процесса, и приступим к созданию линейки диаграммы.

Первое. Нарисовал для понимания бумажный набросок и визуально разбил его на 3 группы ячеек: старт, итерация и окончание.

Набросок маршрута

Второе. Накидали по-быстрому шаблон в HTML. 

Макет диаграммы

Третье. Пояснили себе, какие данные будут отображаться в нём.

Четвёртое и очень длинное. Приступил к раскраске таблички, да! Я рисую это в таблице. Думаю, что можно блоками нарисовать, но удовольствия получим ничуть не меньше. И тут 1С преподносит нам первый сюрприз. Нет границ ячеек, которые мы стилями выделили. +2 часа и 3 литра чая к карме. Решение нашлось, нет содержимого в ячейке - нет границ, а зачем собственно они нам, подумал движок 1С, и рисовать бордюры отказался. Небольшой П.С. Не увидев границ в отчёте, мы его сохраняем на диске и снова открываем, и что же мы видим, границы есть, даже те, что нам не нужны. Фото нет. Верить на слово.

Это была первая преграда на пути к победе. Вторая: отказ прижимать блок в право или растягивать блок/таблицу внутри ячейки на 100% её ширины. Смотрим отчёт.

Всё прекрасно, превышения установленного графика движения не показывает (пока 100%). Ограничиваем интервал. Но только таблица разрядилась (отстрелялась), см рисунок ниже, как чудо пропало. А так хорошо всё начиналось.

Глядим на вторую ячейку и радуемся 100% заполнению сиреневым цветом. ХА! Поздравляю у нас праздник, родился новый браузер. Когда все нормальные браузеры уже давно отображают желанный результат. Встроенный браузер 1С  наотрез отказывается рисовать бордюры и выравнивать элементы. Даже злой IE Ослёрер сдался мне без боя.

Решив проблему с выравниванием справа внутри ячейки, мы натыкаемся на новую проблему, те ячейки, в которых присутствует блок с данными о превышении норматива, показывают теперь нам границы, перекрашивая их из чёрного цвета в белый. Ай красиво! Вот точно так я и представлял себе эту диаграмму. А Ч-Ё-ё!

Ячейки с пропавшим оформлением

Решение простое, если нельзя нарисовать бордюры из самой ячейки, то можно же попробовать оградить бордюрами внешних ячеек и да, помним, что у них должно быть хоть какое то содержание. Да хотя бы и "&nbsp". В итоге после двух дней стилизации получили годный результат и недо опыт верстальщика сайтов.

 

Отчёт в 1С заиграл красками. 

 

Вид из окна Хромого

Так она смотрится в хроме.

 

Вид из домика Осла

Так в осле. (IE, а может ИА)

 

РедПанда показывает без задвигов.

Создавалось творение на платформе 8.3.10.2650 , тестировалось на конфигурации БП 3. Написано на управляемых формах. Работать будет везде. Я так решил.

Я думаю, что поход хобота Сумки на горбатую гору с целью утилизации сверхмощного инопланетного оружия будет легко отрисовать взяв сие творение в крепкие мускулистые/волосатые руки. Ха-Ха.-Ха Доработка под вывод ваших данных минимальна - поправить запрос на входящие данные, код и стили прокомментированы.

П.С.

1. Немного поправил код, теперь отображается и опережение графика. Добавил бордюр слева блоку опережения/отставания. теперь на ч/б печатных экземплярах видна ширина блока.

2. При печати столкнулся с тем, что 1с/браузеры очищают заливку ячеек/блоков. (была попытка переписать всё на блоках, Но очистка заливки и угадывание длины основного блока для предотвращения складывания длинной шкалы прервали движение в этом направлении). Способ напечатать нашёлся: Нужно открыть предварительный просмотр, Нажать на кнопку - "Параметры страницы" и установить галку на - "Печатать цвет фона и рисунки".

тайм лайн таймлайн timeline time line диаграмма css стилизация. html шаблон линейка времени

См. также

Богатый редактор картинок, хранимых в базе, с возможностью РИСОВАНИЯ. Редактор внешних файлов картинок. Объект, расширяющий возможности работы с картинками из встроенного языка (Три в одном) + Обработка «Стандартизация картинок»

Работа с интерфейсом Рабочее место Платформа 1С v8.3 Управляемые формы Конфигурации 1cv8 Платные (руб)

Обработка предназначена для редактирования картинок в режиме «Предприятие», с возможностью РИСОВАТЬ на них. Поддерживается работа как в обычных формах (толстый клиент) так и на управляемых формах (тонкий клиент). Обработка позволяет редактировать как картинки, хранимые в базе, так и графические файлы с диска на файловой системе. Помимо базовых функций (изменение размеров, преобразование формата, обрезание картинки, повороты и т.п.) – редактор имеет богатый набор инструментов для рисования. Доступна функция вставки изображения из буфера обмена. Также обработка может быть использована из встроенного языка как объект для редактирования картинок. Объект может быть использован: на стороне клиента, на стороне сервера, из внешнего соединения. Данная обработка будет особенно полезна тем, кто вносит картинки в базу (изображения номенклатуры, фотографии физических лиц и т.п.). Функционал реализуется с использованием JavaScript и бесплатного ПО ImageMagick (без использования внешних компонент).

6000 руб.

16.01.2015    61800    43    59    

80

[Расширения] Динамическое управление видимостью и доступностью элементов форм (УФ) (8.3.6+)

Работа с интерфейсом Платформа 1С v8.3 Управляемые формы Конфигурации 1cv8 Платные (руб)

Механизм «Динамическое управление доступом к элементам форм объектов 1С8» предназначен для обеспечения возможности оперативного управления видимостью и доступностью элементов форм документов и справочников продуктов фирмы «1С» «1С:Предприятие 8». Решение универсальное, встраивается в любую конфигурацию с минимальными доработками, что позволяет без проблем обновлять типовые решения.

5000 руб.

14.01.2016    54407    16    21    

42

Управление дашбордами

Работа с интерфейсом Платформа 1С v8.3 Конфигурации 1cv8 Платные (руб)

Обработка предназначена для создания и управления дашбордами.

2400 руб.

29.06.2020    16700    21    4    

35

Новогоднее оформление для 1С

Работа с интерфейсом Платформа 1С v8.3 1С:Бухгалтерия 3.0 1С:Управление торговлей 11 1С:Зарплата и Управление Персоналом 3.x 1С:Управление нашей фирмой 3.0 Бесплатно (free)

Добавьте новогоднего настроения! Расширение создает декорацию в виде гирлянды на некоторых формах объектов.

27.12.2023    10743    750    elcoan    45    

106

Конструктор HTML, CSS и javascript

Инструментарий разработчика Работа с интерфейсом Платформа 1С v8.3 Конфигурации 1cv8 Абонемент ($m)

Подходит для создания web-страниц для замены управляемых форм 1С, красивых отчетов, интерфейса мобильного приложения на платформе 1С и для простых страниц веб-сайтов.

2 стартмани

10.04.2023    9623    151    acces969    31    

118

Модель состояния для MVC

Работа с интерфейсом Платформа 1С v8.3 Конфигурации 1cv8 Абонемент ($m)

"MVC плохо применима в 1С" - познакомьтесь с моделью состояния и, возможно, ваше мнение поменяется! Представленное решение является эволюционным развитием идеи реализации MVC для 1С. В новой версии добавлены DSL для описания модели состояния, а также параметризация свойств параметров и элементов формы.

1 стартмани

05.07.2022    3669    kalyaka    2    

27

Табло очереди заказов на экран телевизора

WEB-интеграция Работа с интерфейсом Платформа 1С v8.3 1С:Розница 2 Платные (руб)

Связка из веб-приложения и расширения для 1С: Розница 2.3.

3600 руб.

29.04.2022    12085    1    5    

10
Комментарии
В избранное Подписаться на ответы Сортировка: Древо развёрнутое
Свернуть все
1. aspirator23 339 26.05.18 09:24 Сейчас в теме
Мне казалось он там был в прошлом веке, а оказывается весной этого года. Эвона как. =)
Оставьте свое сообщение