Архитектура визуализации
Визуализация в платформе направлена на понятный интерфейс и положительный пользовательский опыт.
Основные идеи
Удобство пользователя (UI)
- Интуитивно понятный современный UI
- Адаптация под нужды пользователя
- Простота перехода с других платформ
Пользовательский опыт
- Высокое качество целевых проектов
- Высокая оценка заказчика
- Удобство использования в бизнесе
Интеграция с ядром
- Глубокая интеграция с ядром
- Привязка к модельной архитектуре
- Привязка к реактивной архитектуре
Визуализация данных
Идеология визуализации в платформе разделяется на два связанных домена: компоненты среды исполнения и среды разработки.
Среда исполнения
Содержит набор инструментов, необходимых пользователям и операторам для управления технологическими и производственными процессами.
- Мнемосхемы и виджеты
- Элементы управления
- События, тревоги и квитирование
- Тренды и инструменты для работы с временными рядами
- Таблицы и отчёты
- Инструменты удалённого доступа
Среда разработки
Содержит набор инструментов, необходимых пользователям и операторам для управления технологическими и производственными процессами.
- Редактор данных, моделей и объектов
- Редакторы сценариев (core, Lua, TypeScript)
- Редактор событий и тревог
- Редактор компонентов, мнемосхем и виджетов
- Инструменты привязки к данным
- Конфигуратор драйверов
Среда исполнения
Мнемосхемы
Предназначены для схематичной визуализации хода технологического и производственного процесса.
- Динамические и статические элементы
- Состоит из типовых и нестандартных компонентов
- Может содержать виджеты (сложный графический элемент)
- Может включать элементы управления
- Может включать тревоги и тренды
- Может включать внешние компоненты за счёт iFrame и TypeScript
- Поддержка больших мониторов
- Поддержка сетки из нескольких мнемосхем
События и тревоги
Предназначены для отображения событий и связанных с ними тревожных сообщений.
- Диагностические сообщения
- Тревожные сообщения
- Функции квитирования тревог
- Сортировка сообщений и тревог
- Списки последовательные
- Карточки с заморозкой
- Визуальное оповещение
- Звуковое оповещение
Тренды
Предназначены для визуализации и анализа хода технологических и производственных процессов.
- Линейные тренды
- Маркеры и символы
- Множество трендов на одном поле
- Позиционирование осей
- Сравнение абсолютных трендов
- Уставки и тревожные зоны
- Дискретность и плавность
- Динамическое управление
Таблицы
Предназначены для анализа данных технологических и производственных процессов в табличных формах.
- Изменение значений по времени
- Текущие значения
- Сводное сравнение переменных
- Постраничная пагинация
- Сортировка и поиск
- Работа с архивом
- Быстрый экспорт
- Формирование отчётов
Среда разработки
Обеспечивает возможность создания сложных интерактивных приложений
Редактор моделей
Предназначен для разработки структур моделей.
- Создание структуры модели
- На основе простейших моделей
- На основе сложных моделей
- Создание вложенности
- Привязка графического компонента
Редактор объектов
Предназначен для разработки объектов.
- Создание структуры объекта
- На основе сложных моделей
- Подключение данных (драйверы, имитация)
- Привязка сценариев (JS, Lua)
- Настройка сервера для внешнего доступа (OPC UA)
Среда графической разработки
Обеспечивает возможность создания современной графики для встроенных платформенных приложений
Векторный редактор
Предназначен для создания сложной векторной графики для мнемосхем и создания библиотек типовых элементов.
- Встроенный нативный редактор
- Собственная разработка
- Создание компонентов и типовых элементов
- Создание мнемосхем и виджетов
- Встроенный механизм привязок к данным
- Встроенный редактор сценариев
- Совместимость с общепринятым векторным форматом
Редактор привязок
Предназначен для сопряжения векторных документов, разработанных в сторонних распространённых редакторах.
- Совместимость с общепринятым векторным форматом
- Работа с моделью SVG (DOM)
- Настройка компонентов и типовых элементов
- Настройка мнемосхем и виджетов
- Обеспечивает механизм привязки к данным
- Обеспечивает механизм встраивания сценариев
- Такие документы требуется разрабатывать согласно гайдам
Какие графические элементы и приложения доступны
Основа сложных проектов
Типовые элементы
Элементарные графические компоненты.
- Небольшие смысловые визуальные формы
- Например насос, клапан, задвижка, бак
- Можно встраивать в мнемосхемы
- Можно формировать библиотеки
Виджеты
Небольшие приложения из типовых элементов.
- Можно встраивать в мнемосхемы
- Можно формировать библиотеки
- Можно давать внешний доступ
- Например, тренд или панель управления арматурой
Мнемосхемы
Типовое платформенное приложение.
- Состоят из компонентов и виджетов
- Может включать статические и динамические элементы
- Может осуществлять функции вызова команд
- Доступ к платформенному API
Композиты
Расширенное платформенное приложение.
- Состоит из мнемосхем и виджетов
- Разметка сетки из нескольких мнемосхем и блоков
- Может включать внешние компоненты за счёт iFrame и TypeScript
- Поддержка больших мониторов
Как привязывать данные
Привязка мнемосхем к данным по модели — в один клик
- Привязка компонентов мнемосхемы выполняется на основе моделей
- Компонент может повторять структуру данных модели
- При совпадении моделей компонента и объекта привязка происходит автоматически
- Таким образом можно привязать к данным целую мнемосхему
- Одним действием при соответствии моделей
Как программировать мнемосхемы и виджеты
Редактор сценариев мнемосхем и виджетов
Предназначен для создания, редактирования и отладки кода для работы с графическими элементами.
- Обработка данных мнемосхем и виджетов
- Поддержка реактивности
- Анимация графических элементов
- Подсветка синтаксиса
- Поддержка TypeScript
- Работа с внешними данными через REST
Композитные мнемосхемы
Расширение функциональности стандартных мнемосхем
Единое полотно из многих источников
Собирает несколько мнемосхем, виджетов и внешних источников в одну большую схему.
- Компоновка через редактор сетки под большие экраны, видеостены и стенды коллективного пользования
- Готовые пресеты раскладок и свободное изменение сетки
- Встраивание внешнего веб-приложения в ячейку (iframe)
- Подключение данных и элементов из сторонней системы (скрипт)
Мнемосхемы и виджеты
Типовые элементы, виджеты и вложенные мнемосхемы в ячейках.
Inline Frame
Встраивание внешних веб-приложений с помощью iframe.
Скрипт
Встраивание внешних веб-приложений с помощью TypeScript.
Браузер
Платформа обеспечивает работу в современных браузерах.
- Yandex Браузер
- Google Chrome
- Все на движке Chromium
- Доступность для клиентов без установки
Толстый клиент
Функционал доступен в толстом клиенте.
- Не требует браузера
- Для одного монитора
- Для многомониторных систем
- Контроллер управления экранами коллективного пользования
Толстый клиент
Рабочее место оператора
Рабочее приложение оператора.
- Платформенное приложение
- Не требует браузера
- Требует установки
- Поддержка Embedded
- Поддержка панелей коллективного пользования
- Поддержка Linux, Mac, Windows
- Разработан на C++/Qt, соберём везде
Контроллер видеостены
Управление большими экранами коллективного пользования.
- Централизованное управление стеной
- Поддержка привязанных и свободных окон
- Формирование раскладки на своём мониторе
- Разворачивание раскладок на разные видеопанели
- Поддержка разных режимов
- Интерактивный (десятки экранов)
- Снапшоты пула (сотни экранов)