Пример вывода интерактивного графика

Name: Пример вывода интерактивного графика
Availability: InStock
Author: Falcon Space

Используется специальный режим таблицы apexChart.

GetItems таблицы (без столбцов):

CREATE PROCEDURE [dbo].[crud_interactiveChart_getItems]
	@filters CRUDFilterParameter READONLY,  
	@sort sql_variant,
	@direction nvarchar(8),
	@page int,
	@pageSize int,
	@username nvarchar(32)
AS
BEGIN
	
	-- SELECT 1
	select   1
    
	-- SELECT 2 
	select 1

	-- SELECT 3
    select 'apexchart' viewType, 1 HideTitleCount, '{
      "chart": {
        "type": "line"
      },
      "series": [{
        "name": "Выручка",
        "data":   [30,40,35,50,49,60,70,91,125],
        "color": "#afa"
      }, 
      {
        "name": "Затраты",
        "data":  [20,10,15,40,29,50,20,15,45],
        "color": "#faa"
      }],
      "xaxis": {
        "categories": [1991,1992,1993,1994,1995,1996,1997, 1998,1999]
      }
    }
    ' apexChartOptions

END

Документация - https://falconspace.ru/docs/interaktivnye-diagrammy--grafiki

Другие демостенды

— Вывод круговой диаграммы polarArea
— Как отобразить гистограмму bar на странице
— Вывод диаграммы по дням из данных таблицы

Что есть в базе знаний по этой теме

— Как делать различный набор столбцов одной таблицы для разных ролей
— Диаграммы и графики, визуализация
— Руководство по юзабилити сайтов на Falcon Space
— Логирование изменений объектов на примере хранимых процедур
— Интерактивные диаграммы, графики

В чем выгода для бизнеса?

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