Диаграмма Ганта и графическая схема сторонними средствами

17.12.18

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

Примеры формирования диаграммы Ганта и графической схемы в 1С сторонними средствами.

Файлы

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

Наименование Скачано Купить файл
Диаграмма Гантта в html:
.epf 93,68Kb ver:1.0.0
8 1 850 руб. Купить
Графическая схема в html
.epf 45,95Kb ver:1.0.0
1 1 850 руб. Купить

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

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

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

Недавно возникла необходимость формировать отчеты на мобильных устройствах. Для реализации идеи решили попробовать мобильный клиент.
С обычными отчетами проблем не возникло, но были два отчета, которые "не смогли".
Один из них - Диаграмма Гантта, другой - построен при помощи Географической схемы. Эти типы не имеют отображения на мобильном клиенте.

Было решено попробовать вывести данные отчетов в поле html.


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

Самым простым способом показалось использовать amCharts. Спасибо публикации за примеры работы с библиотеками. 
 

В обработке подготовлен шаблон html, который всего лишь нужно дополнить выводимыми данными.
Формируем таблицу данных:
 

Функция ПолучитьДанные()
	
	Данные = Новый ТаблицаЗначений;
	
	Данные.Колонки.Добавить("category");
	Данные.Колонки.Добавить("segments");
	
	ТаблицаСегментов = Новый ТаблицаЗначений;
	ТаблицаСегментов.Колонки.Добавить("start");
	ТаблицаСегментов.Колонки.Добавить("end");
	ТаблицаСегментов.Колонки.Добавить("color");
	ТаблицаСегментов.Колонки.Добавить("task");
	
	НоваяСтрока = Данные.Добавить();
	НоваяСтрока.category = "Авиа";
	ТаблицаСегментов.Очистить();
	
	НоваяСтрокаСегментов = ТаблицаСегментов.Добавить();
	НоваяСтрокаСегментов.start = "2016-01-01";
	НоваяСтрокаСегментов.end = "2016-01-14";
	НоваяСтрокаСегментов.color = "#b9783f";
	НоваяСтрокаСегментов.task = "Gathering requirements";
	
	НоваяСтрокаСегментов = ТаблицаСегментов.Добавить();
	НоваяСтрокаСегментов.start = "2016-02-01";
	НоваяСтрокаСегментов.end = "2016-02-14";
	НоваяСтрокаСегментов.color = "#b9783f";
	НоваяСтрокаСегментов.task = "Gathering requirements";
	
	НоваяСтрока.segments = ТаблицаСегментов;
	
	НоваяСтрока = Данные.Добавить();
	НоваяСтрока.category = "Прокат";
	
	ТаблицаСегментов = Новый ТаблицаЗначений;
	ТаблицаСегментов.Колонки.Добавить("start");
	ТаблицаСегментов.Колонки.Добавить("end");
	ТаблицаСегментов.Колонки.Добавить("color");
	ТаблицаСегментов.Колонки.Добавить("task");
	ТаблицаСегментов.Очистить();
	
	НоваяСтрокаСегментов = ТаблицаСегментов.Добавить();
	НоваяСтрокаСегментов.start = "2016-01-02";
	НоваяСтрокаСегментов.end = "2016-01-18";
	НоваяСтрокаСегментов.color = "#cc4748";
	НоваяСтрокаСегментов.task = "Producing specifications";
	НоваяСтрока.segments = ТаблицаСегментов;
	
	НоваяСтрокаСегментов = ТаблицаСегментов.Добавить();
	НоваяСтрокаСегментов.start = "2016-02-02";
	НоваяСтрокаСегментов.end = "2016-02-18";
	НоваяСтрокаСегментов.color = "#cc4748";
	НоваяСтрокаСегментов.task = "Producing specifications";
	НоваяСтрока.segments = ТаблицаСегментов;
	
	НоваяСтрокаСегментов = ТаблицаСегментов.Добавить();
	НоваяСтрокаСегментов.start = "2016-03-02";
	НоваяСтрокаСегментов.end = "2016-03-18";
	НоваяСтрокаСегментов.color = "#cc4748";
	НоваяСтрокаСегментов.task = "Producing specifications";
	НоваяСтрока.segments = ТаблицаСегментов;
	
	Возврат Данные;
	
КонецФункции

Далее таблица преобразуется в строку и передается в шаблон.

В итоге получаем: 

 

Графическая схема.

В свое время возникла необходимость графически отображать цепочки продаж.

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

При решении текущей задачи вспомнилась работа с графикой на js при помощи библиотеки raphael.
В итоге все свелось просто к рисованию фигур по точкам. Точки брались прямо из графической схемы:
 

Процедура ЗаполнитьПример()
	
	СписокИдентификаторов.Очистить();
	Уровень1 = ДеревоОбъектов.ПолучитьЭлементы();
	Уровень1.Очистить();
	
	ГрафСхемаXDTO=СериализаторXDTO.ЗаписатьXDTO(ГрафСхема);
	
	Для Каждого ОбъектГС Из ГрафСхемаXDTO.Item Цикл
		
		Если ОбъектГС.itemtype = 9 Тогда
			
			НовСтр = Уровень1.Добавить();
			
			ТочкиСтрокой = "";
			
			Для Каждого Точка Из ОбъектГС.point Цикл
				
				ТочкиСтрокой = ТочкиСтрокой + ?(ПустаяСтрока(ТочкиСтрокой), "", ", ") + СтрЗаменить(Строка(Точка.x), Символы.НПП, "") + ", " + СтрЗаменить(Строка(Точка.y), Символы.НПП, "");
				
			КонецЦикла;
			
			НовСтр.Шейп = ТочкиСтрокой;
			НовСтр.Цвет = "#ffa0e0";
			НовСтр.Описание = ОбъектГС.itemCode;
			НовСтр.Описание_Точка = "0, 0";
			СписокИдентификаторов.Добавить(НовСтр.ПолучитьИдентификатор());
			
		ИначеЕсли ОбъектГС.itemtype = 1 Тогда
			
			НовСтр = Уровень1.Добавить();
			
			ТочкиСтрокой = "";
			
			МассивТочек = Новый Массив;
			
			Для Каждого Точка Из ОбъектГС.point Цикл
				
				ТочкиСтрокой = ТочкиСтрокой + ?(ПустаяСтрока(ТочкиСтрокой), "", ", ") + СтрЗаменить(Строка(Точка.x), Символы.НПП, "") + ", " + СтрЗаменить(Строка(Точка.y), Символы.НПП, "");
				МассивТочек.Добавить(СтрЗаменить(Строка(Точка.x + 1), Символы.НПП, "") + ", " + СтрЗаменить(Строка(Точка.y), Символы.НПП, ""));
				
			КонецЦикла;
			
			Сч = МассивТочек.Количество() - 1;
			Пока Сч >= 0 Цикл
				
				ТочкиСтрокой = ТочкиСтрокой + ", " + МассивТочек[Сч];
				
				Сч = Сч - 1;
				
			КонецЦикла;
			
			НовСтр.Шейп = ТочкиСтрокой;
			НовСтр.Цвет = "#999999";
			НовСтр.Описание = "";
			НовСтр.Описание_Точка = "0, 0";
			НовСтр.Линия = Истина;
			СписокИдентификаторов.Добавить(НовСтр.ПолучитьИдентификатор());
			
		КонецЕсли;
		
	КонецЦикла;	
	
КонецПроцедуры

В итоге получаем:

Стрелочки рисовать уже не стал. Но, при желании, это можно сделать.

 

Обе обработки делались на платформе 8.3.11.2867

Тестировалось на конфигурации Управление нашей фирмой, редакция 1.6 (1.6.13.60), но должно работать на любой другой конфигурации под управляемыми формами. 

Вступайте в нашу телеграмм-группу Инфостарт

Обработка гантт диаграмма гантта amCharts амчартс графическая схема js raphael мобильный клиент работа с html гант ганта.

См. также

Работа с интерфейсом Анализ учета Мониторинг 1С:Предприятие 8 1С 8.3 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    56405    31    25    

45

Разработка Инструментарий разработчика Работа с интерфейсом Адаптация типовых решений Нейросети 1C:Бухгалтерия 1C:ERP 1С:ЗУП 1С:КА 1С:УНФ 1С:УТ 1С:Розница 1С:ДО 1С:ERP Управление предприятием 2 Платные (руб)

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

36000 руб.

28.08.2025    2703    1    2    

4

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

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

6000 руб.

14.01.2016    58242    20    25    

46

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

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

5160 руб.

29.06.2020    22865    32    6    

51

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

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

5040 руб.

06.10.2020    12852    8    8    

14

Работа с интерфейсом Программист Стажер 1С:Предприятие 8 Бесплатно (free)

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

20.08.2024    43395    mrXoxot    44    

138

Работа с интерфейсом Программист 1С:Предприятие 8 Бесплатно (free)

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

27.05.2024    24834    smielka    38    

111
Комментарии
Подписаться на ответы Инфостарт бот Сортировка: Древо развёрнутое
Свернуть все
1. 1segen1 33 02.11.18 08:05 Сейчас в теме
Не знал, что название диаграммы уже пишется по-другому (Гантт).
2. no_betrayal 27 02.11.18 11:18 Сейчас в теме
(1)Взято с Вики. Да и в амЧартс в английском варианте gantt. Хотя СП считает иначе)
3. Desere799 1105 06.02.20 08:52 Сейчас в теме
Как убрать гиперссылку "Js chart by amCharts" ?
4. no_betrayal 27 06.02.20 14:29 Сейчас в теме
(3)Эта ссылка - условие бесплатного использования библиотеки.

Но если очень сильно хочется заморочиться - можно сделать следующее:

1. Заменить процедуру в форме:
Процедура СформироватьГанттаНаСервере()
	
	Данные = ПолучитьДанные();
	
	ДанныеСтрокой = AmChartsДанные(Данные);
	
	ОбработкаОбъект = РеквизитФормыВЗначение("Объект");
	
	//Шаблон = ОбработкаОбъект.ПолучитьМакет("Шаблон").ПолучитьТекст();
	Шаблон = ОбработкаОбъект.ПолучитьМакет("Макет").ПолучитьТекст();
	amcharts = ОбработкаОбъект.ПолучитьМакет("amcharts").ПолучитьТекст();
	serial = ОбработкаОбъект.ПолучитьМакет("serial").ПолучитьТекст();
	light = ОбработкаОбъект.ПолучитьМакет("light").ПолучитьТекст();
	gantt = ОбработкаОбъект.ПолучитьМакет("gantt").ПолучитьТекст();
	
	Текст = СтрЗаменить(Шаблон, "&amcharts.js", amcharts);
	Текст = СтрЗаменить(Текст, "&serial.js", serial);
	Текст = СтрЗаменить(Текст, "&light.js", light);
	Текст = СтрЗаменить(Текст, "&gantt.js", gantt);
	
	ПолеХТМЛ = СтрЗаменить(Текст, "&DataProvider", " [ " + ДанныеСтрокой + " ] ");
	
КонецПроцедуры
Показать


Так перейдем на использование скриптом из шаблонов.
2. В шаблоне "amcharts" найти неугодную фразу и заменить, например, на пустую строку.

Но я настоятельно рекомендую в таком случае перенести ссылку хотя бы на форму, чтобы не нарушать пользовательское соглашение.
Desere799; +1 Ответить
5. Desere799 1105 06.02.20 15:17 Сейчас в теме
(4) можно оставить на форме но скрыть видимость ))
и еще такой вопрос, можно ли добавить текст в шкалу времени (или рядом)
и можно ли отобразить числа месяца ?
6. no_betrayal 27 06.02.20 16:36 Сейчас в теме
(5)Если текст нужен под шкалу времени, в макете шаблона можно попробовать добавить еще один div элемент с текстом.

и можно ли отобразить числа месяца ?


Дата нужна в формате 06.02, а не фев 02?

Сейчас точно не подскажу, как сделать. Нужно курить документацию:
https://docs.amcharts.com/3/javascriptcharts/AmCharts


Я обычно открывал демку диаграммы https://www.amcharts.com/demos-v3/gantt-chart-dates-v3/
Там есть возможность перейти в редактор
"Open in:"
Я использую codepen.
Там можно поэкспериментировать с параметрами и прочим.

Но на скорую руку сделать не получилось.

У меня использована версия 3, в версии 4 сильно больше настроек для шкалы времени.
Desere799; +1 Ответить
Для отправки сообщения требуется регистрация/авторизация