КомпоГраф — библиотека веб-компонентов UI и конструктор диаграмм

Назначение

Создание пользовательских интерфейсов веб-приложений

Отображение массивов данных в виде таблиц и диаграмм

Размещение управляющих элементов и панелей

Визуализация данных в интерактивных диаграммах

Конструирование диаграмм различных типов

Ключевые функции

Готовые UI компоненты: кнопки, поля, таблицы

Веб-конструктор для создания диаграмм

Компоненты отображения: графики, гистограммы

Интеграция в веб-приложения

API для разработчиков

Три основных модуля КомпоГраф

Веб-компоненты UI

Набор готовых веб-компонентов для создания пользовательских интерфейсов: кнопки, поля ввода, таблицы, меню, панели и другие элементы управления.

Конструктор диаграмм

Веб-конструктор для создания диаграмм различных типов: графики, гистограммы, точечные, лепестковые диаграммы и индикаторы.

Компоненты отображения

Набор компонентов для отображения диаграмм в веб-приложениях, созданных с помощью конструктора или программно.

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

Элементы управления

КНОПКИ

Управляющие элементы

Основные кнопки с иконками
Кнопки включатели
Кнопки переключатели
Плавающие кнопки
Панели кнопок

ПОЛЯ

Поля ввода

Поле ввода чисел
Поле поиска
Поле со списком
Выбор даты
Диапазон значений

ПЕРЕКЛЮЧАТЕЛИ

Селекторы

Флажки (checkbox)
Выключатели (switch)
Переключатели (radio)
Выпадающий список

Компоненты отображения данных

ТАБЛИЦЫ

Структуры данных

Грид (таблицы данных)
Грид с древом
Древовидные списки
Аккордеон

ИНТЕРФЕЙС

Элементы навигации

Вкладки
Основное меню формы
Контекстное меню
Модальные окна

ИНДИКАЦИЯ

Обратная связь

Прогресс бар
Загрузка
Всплывающие уведомления
Области контента

Технические характеристики

Технологии	HTML5, CSS3, JavaScript, TypeScript
Браузеры	Chrome, Firefox, Safari, Edge (современные версии)
Интеграция	Совместимость с популярными JS-фреймворками
Стилизация	Настраиваемые CSS-стили и темы оформления
API	Документированный API для разработчиков

Веб-конструктор диаграмм позволяет пользователям создавать собственные конфигурации для отображения данных на диаграммах различных типов. Конструктор включает три основные вкладки: «Общие», «Оси» и «Графики».

Типы диаграмм

Основные типы

График (линейные диаграммы)

Гистограмма (столбчатые диаграммы)

Точечная (scatter plot)

Лепестковая (радарная)

Индикатор

Возможности настройки

Заголовок диаграммы и легенда

Настройка осей и сетки

Цвета и стили линий

Маркеры и заливка

Фон диаграммы

Интерфейс конструктора

ОБЩИЕ

Основные настройки

Заголовок диаграммы
Легенда и её расположение
Фон диаграммы
Размеры и шрифты

ОСИ

Настройка осей

Заголовки осей
Диапазоны значений
Цвета и стили
Сетка координат

ГРАФИКИ

Ряды данных

Выбор рядов данных
Стили линий и маркеров
Заливка областей
Обработка некачественных данных

Возможности настройки

Расположение легенды	Сверху, снизу, слева, справа (по центру и по краям)
Редактирование осей	Заголовки, диапазоны, цвета, стили
Настройка сетки	Отображение, цвет, стиль линий сетки
Стили графиков	Цвет, толщина линий, тип маркеров, заливка
Обработка данных	Фильтрация некачественных данных

КомпоГраф предназначен для разработчиков веб-приложений. Руководство разработчика содержит описание API, примеры использования и интеграции компонентов в проекты.

Целевая аудитория

Разработчики

Frontend-разработчики веб-приложений

Создатели пользовательских интерфейсов

Разработчики корпоративного ПО

Команды, работающие с визуализацией данных

Пользователи

Конечные пользователи веб-приложений

Аналитики и операторы

Менеджеры проектов

Специалисты по работе с данными

Примеры компонентов API

kg-checkbox

Флажок

Свойства: checked, disabled, value
События: change
Динамическое добавление
Преобразование типов

kg-select

Поле со списком

Работа с базой данных
Методы и свойства API
События выбора
Настройка отображения

kg-datepicker

Выбор даты

Интерфейс календаря
Форматирование дат
События изменения
Локализация

Документация

Руководство разработчика	Полное описание API, примеры кода, интеграция
Руководство пользователя	Работа с конструктором диаграмм, настройка интерфейса
Примеры использования	Готовые сценарии интеграции компонентов
Справочник API	Описание всех методов, свойств и событий

Требования к пользователям

Опыт работы с ПК

Windows/Linux

Веб-браузеры

HTML/CSS/JS

TypeScript (желательно)

КомпоГраф подходит для создания пользовательских интерфейсов в различных сферах: от корпоративных веб-приложений до систем визуализации данных и аналитических панелей.

Области применения

Корпоративные веб-приложения

Аналитические панели

Системы мониторинга

Панели управления

ERP системы

CRM системы

Бизнес-аналитика

IoT платформы

Типы проектов

Корпоративные системы

ERP и CRM системы

Системы документооборота

HR-платформы

Управление проектами

Аналитика и мониторинг

Дашборды бизнес-аналитики

Системы мониторинга

Панели КПЭ

Отчетность и визуализация

Отраслевые решения

Промышленные АСУ ТП

Энергетические системы

Финансовые платформы

Медицинские информационные системы

Преимущества для разработчиков

Готовые решения

Сокращение времени разработки

Унифицированный UI/UX

Протестированные компоненты

Документированное API

Техническая поддержка

Отечественная разработка

Техническая поддержка ИнфТех

Обновления и доработки

Соответствие российским стандартам

Партнеры ИнфТех

Роснефть

ЛУКОЙЛ

Газпром нефть

Татнефть

Башнефть

Транснефть

Росэнергоатом

КомпоГраф — продукт с открытой архитектурой для интеграции в любые веб-проекты. Подробная информация о внедрениях — по запросу.