Продвинутое форматирование свойств виджетов

Для настройки внешнего вида элементов в зависимости от условия или форматирования отдельных элементов виджетов, используется продвинутое форматирование свойств виджетов. Данная настройка включается соответствующими настройками на вкладке визуальных свойств виджетов.

1. Для настройки форматирования визуальных свойств, в платформе существуют зарезервированные функции, используя которые можно получить интерактивное отображение данных на виджетах или виджеты удовлетворяющие особым визуальным аспектам.
2. Для работы с цветом, существует несколько способов задания цвета
   • HTML имя цвета
     • 
   • rgba
     • 
   • HEX
     • 
3. Правила синтакисиса
   • Математические операции:
     • @value * 1000
     • (@value +100)/100
     • и т.д.
   • Логические операции:
     • @row[0] - @row[1] > 100 ? 'blue':'red'
     • @level == 0 ? @value + ' год' : @level==1? 'месяц ' + @value : ''
     • @value == 'Стоимость реализации товара' ? @value + " руб." : ""
     • @columnPath == "Январь" ? '#03a9e3' : ""
     • и т.д.
   • Дополнение текста:
     • @value + " руб."
     • @value == "Ж" ? @value = "Женщины": @value == "М" ? @value = "Мужчины": @value
     • и т.д.
   • Форматирование стиля текста:
     • '<div style=»color: red»>' + @value + '</div>'
     • '<div style=»color:' + @point.color + '»> '+ @series.name+ '</div'

Доступные функции для виджетов:

1. Виджеты "График", "Гистограмма", "Линейчатая диаграмма"
   • Доступные функции:

     • Форматирование подписей и подсказки:

       • @value.y - значение точки
       • @value.x - название точки
       • @point.name - название точки
       • @point.color - цвет серии
       • @series.name - название серии

     • Форматирование Оси X и Оси Y:

       • @value - название (занчение, если числа) точки
2. Виджет "Круговая диаграмма"
   • Доступные функции:
     • Форматирование подписей и подсказки:
       • @value.y - значение точки
       • @point.name - название точки
       • @point.color - цвет точки
       • @series.name - название серии
       • @total - сумма значений всех точек в серии
     • Форматирование подписи в центре:
       • @total - сумма значений всех точек в серии
3. Виджет "Таблица"
   • Доступные функции:
     • Форматирование значений:
       • @value - значение в ячейке таблицы
4. Виджет "Сводная таблица"
   • Доступные переменные:
     • Форматирование шапки:
       • @value - значение ячейки
     • Форматирование текста боковика:
       • @value - значение в ячейке таблицы
       • @level - уровень вложенности
       • @rowLevel (@level) - текущий уровень вложенности
       • @path- массив всех родительских уровней
         • @path[0] - самый первый родитель
         • @path[@level-1] - ближайший родитель
     • Форматирование ячеек данных:
       • @value - значение в ячейке таблицы
       • @rowPath- массив родителей-строк
       • @rowLevel - текущий уровень вложенности по строкам (РАБОТАЕТ С 1)
       • @columnPath- массив родителей-столбцов
       • @columnLevel - текущий уровень вложенности
       • @value - значение ячейки
5. Виджет "Плоская таблица"
   • Доступные переменные:
     • Форматирование шапки:
       • @value - значение в шапке таблицы
     • Форматирование ячеек данных:
       • @value - значение в ячейке таблицы
       • @column - название столбца в таблице
       • @row - массив значений строчки
         • @row[0] - обращение к элементу массива через индекс столбца
         • @rowByName['"Fakticheskie_prodazhi_v_rublyah","Stoimost_realizatsii"'] - обращение к элементу массива через unique name
6. Виджет "Текст"
   • Доступные функции:
     • @value - первое значение в данных
     • @array - массив данных. Можно указывать индекс @array[1] - взять второй элемент в массиве. Индекс начинается с нуля.

Примеры использования:

1. Замена значения первого уровня измерения

   @level===0&&@path[0]===`ru-al`?`Алтайский край` : @level===0&&@path[0]===`ru-ir`?`Иркутская область` :@level===0&&@path[0]===`ru-ms`?`Москва` :@level===0&&@path[0]===`ru-pr`?`Приморский край` :@level===0&&@path[0]===`ru-sa`?`Самарская область` :@level===0&&@path[0]===`ru-sc`?`Севастополь` :@value

   

2. Дополнение подписей показателя

   @value + ' RUR'

   

3. Дополнение подписей измерения

   @level == 0 ? @value + ' год' : @level==1? 'месяц ' + @value : ''

   

4. Изменение значений в ячейке при помощи логических и математических операция

   @value >2200 ? @value * 5: @value/5

   

5. Изменение цвета текста в ячейках в зависимости от определенного значения и названия измерения

   @value < 2200 && @columnPath =="Январь"? "red" : "black"

   

6. Изменение цвета фона ячеек в зависимости от названия месяца

   @columnPath == "Январь" ? '#03a9e3' : @columnPath == "Февраль" ? '#0bb2c4' : @columnPath == "Март" ? '#3bad68' :  @columnPath == "Апрель" ? '#8bbd38' :  @columnPath == "Май" ? '#cfc903' :  @columnPath == "Июнь" ? '#f9ad01' : @columnPath == "Июль" ? '#f08002' : @columnPath == "Август" ? '#ec494c' : @columnPath == "Сентябрь" ? '#cf687d' : @columnPath == "Октябрь" ? '#98648a' : @columnPath == "Ноябрь" ? '#6881b9' : @columnPath == "Декабрь" ? '#0078aa' : '000000'
   
   

   

7. Корректировка названий столбцов

   @value == 'Стоимость реализации товара' ? @value + " руб." : @value == 'Закупочная стоимость' ? @value + " руб." : @value == 'Город' ? @value = "Города России" : " "
   
   

   

8. Корректировка значений в ячейках

   @value == "Ж" ? @value = "Женщины": @value == "М" ? @value = "Мужчины": @value
   

   

9. Подкраска цветом в зависимости от значения:

   @value =='Самара' || @value == 'Барнаул' ? "red": 'rgba(0,0,0,0)' && @value == 'Севастополь' || @value =='Тольятти' || @value
   
   

   

10. Подкраска цветом при сравнении значений, если разница между значениями больше 100:

    @row[0] - @row[1] > 100 ? 'blue':'red'
    или
    @rowByName['"Fakticheskie_prodazhi_v_rublyah","Stoimost_realizatsii"'] - @rowByName['"Fakticheskie_prodazhi_v_rublyah","Zakupochnaya_stoimost"'] > 100 ? 'blue':'red'