Диаграммы и графики в личном кабинете на сайте
Смотреть пример графиков и диаграмм
Отдельный режим работы компонента Таблица.
Позволяет выводить графики и диаграммы
- в SELECT 3 GetItems ставим ViewType = "chart" и настраиваем следующие параметры:
- ChartLineCommaLabels - ось X через запятую для типа line, например, '1,2,3,5'
- ChartOptions - JSON для настроек компонента Chart. По умолчанию он имеет такой вид (детали параметров можно посмотреть в документации по chartJS):
{
responsive: true,
maintainAspectRatio: false,
title: {
display: type != "bar" && type != "horizontalBar",
text: title
},
legend: {
display: true,
labels: {
fontSize: 13
}
},
tooltips: {
titleFontSize: 14,
bodyFontSize: 11,
},
scales: {
}
}
- ChartTitle - заголовок диаграммы,
- ChartType - тип диаграммы line, bar, pie, radar (и некоторые другие типы из https://www.chartjs.org/docs/latest/),
- ChartWidth, ChartHeight - ширина и высота (если поставить 0, то будет растягиваться на 100% контейнера),
Примечание: также в этом JSON можно добавить установку размеров контейнера (div.as-chart) через параметры contWidth, contHeight (в некоторых случаях это необходимо для того, чтобы диаграмма не налезала на нижележащие элементы). Пример:
select '{"responsive": true, "contWidth": "100%", "contHeight": "1200px"}' chartOptions
2. в SELECT 1 вывести данные карточек Title, Value, Color (цвет элемента, например #F00).
- Для line Value - это строка-список значений через запятую ('23,43,12,34')
- Для других типов Value - число, значение соответствующего элемента в диаграмме.
Дополнительные материалы
- Пример работы диаграммы на стенде Watch
- Диаграмма Ганта на сайте
- Диаграмма Chartbar
- Интерактивные диаграммы, графики
Falcon Space - функциональная веб-платформа разработки на узком стеке MS SQL/Bootstrap. Вводная по Falcon Space
Google поиск по нашей документации
- Руководства
- Основа Falcon Space
- Основные компоненты Работа со статусами. Управление статусами заявок, сущностей в личных кабинетах пользователей Работа с таблицами. Создание таблиц на сайте Работа с формами Работа с дашбордами личных кабинетов Диаграммы и графики в личном кабинете на сайте Календарь. Управление событиями в личном кабинете Терминал - рабочее пространство с окнами и вкладками
- Возможности
- Коммуникация с пользователем
- Дизайн, стилизация
- Лендинги
- Универсальный API
- Примеры интеграций
- Каталоги
- Навигация
- Документы
- Дополнительные компоненты
- Продвижение, SEO
- Системные моменты
- Системное администрирование
- HOWTO
- Таблицы
- Формы
- Загрузка файлов, картинок
- Работа с SQL
- HOWTO JS
- HOWTO Верстка
- Решение проблем
Falcon Space
Это снижение стоимости владения
за счет меньшего количества людей для поддержки и узкого стека разработки. Про снижение стоимости владения продуктом
Это быстрое внесение изменений
по ходу эксплуатации программы. Как создается функционал на платформе
Это простой удобный интерфейс
адаптация под мобильные устройства. Про юзабилити платформы
Нужна бесплатная консультация?
Получить оценку проекта
Создайте концепцию проекта на основе нашего шаблона и получите оценку проекта в виде КП.
Демо-сайт решений
Базисные решения, которые можно гибко адаптировать под себя: менять внешний вид, бизнес-логику и даже структуру базы данных.