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

02.01.19

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

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

Файлы

ВНИМАНИЕ: Файлы из Базы знаний - это исходный код разработки. Это примеры решения задач, шаблоны, заготовки, "строительные материалы" для учетной системы. Файлы ориентированы на специалистов 1С, которые могут разобраться в коде и оптимизировать программу для запуска в базе данных. Гарантии работоспособности нет. Возврата нет. Технической поддержки нет.

Наименование Скачано Купить файл
Диаграмма TimeLine! Этапы маршрута на шкале времени. (Поход Дерсу):
.epf 14,72Kb
4 1 850 руб. Купить

Подписка PRO — скачивайте любые файлы со скидкой до 85% из Базы знаний

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

Оформить подписку и скачать решение со скидкой

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

  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 8.3.14 1C:Бухгалтерия 1С:Бухгалтерия 3.0 1С:Библиотека стандартных подсистем 1С:ERP Управление предприятием 2 1С:Управление холдингом 1С:Зарплата и Управление Персоналом 3.x 1С:Комплексная автоматизация 2.х 1С:Управление нашей фирмой 3.0 1С:Управление торговлей 11 Платные (руб)

Создайте свой функциональный интерфейс в любой конфигурации 1С с помощью расширения Infostart Dashboard. Настраивайте панели виджетов с метриками, индикаторами и показателями на начальном экране. Узнайте возможность внедрения подсистемы у себя в конфигурации с помощью бесплатной обработки "Анализ внедрения подсистемы 1С Infostart Dashboard"!

28800 руб.

27.03.2025    54028    29    25    

43

Работа с интерфейсом Программист 1С v8.3 1C:Бухгалтерия 1С:ERP Управление предприятием 2 Платные (руб)

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

5160 руб.

29.06.2020    22754    32    6    

51

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

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

5040 руб.

06.10.2020    12747    8    8    

14

Работа с интерфейсом Программист Стажер 1С v8.3 Бесплатно (free)

Это инструкция по дизайну форм в среде 1С. Гайд охватывает рекомендации и стандарты для оптимизации пользовательского интерфейса. В гайде содержатся указания по использованию элементов интерфейса, включая как основные, так и продвинутые аспекты. Предоставляются также примеры и антипримеры для наглядного понимания принципов дизайна

20.08.2024    42695    mrXoxot    44    

138

Работа с интерфейсом Программист 1С v8.3 Бесплатно (free)

Пример простого и симпатичного прогресс-бара в динамическом списке, без картинок, используя редактирование запроса.

27.05.2024    24684    smielka    38    

111

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

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

27.12.2023    22835    1343    elcoan    53    

130

Инструментарий разработчика Работа с интерфейсом Программист 1С v8.3 1C:Бухгалтерия Абонемент ($m)

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

3 стартмани

10.04.2023    16178    178    acces969    31    

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