/
Примеры форматирования

Примеры форматирования

Форматирование данных, отображаемых в графике

Desktop Designer позволяет гибко настраивать визуализацию отображаемых данных для фокусировки внимания на их отдельных элементах в графиках, гистограммах и т.д. В нашем примере мы будем придерживаться следующего сценария:

  • Загрузка графика с настроенными данными.

  • Форматирование значений.

    • Изменение значений по оси Y.

    • Изменение значений по оси Х.

    • Изменение значений на точках графика.

Шаг 1. Загрузка графика с настроенными данными

  1. Откройте приложение Desktop Designer.

  2. Откройте ранее созданный дашборд:

  3. Выберите виджет, который хотите отформатировать. В нашем примере это График:

     

  4. На вкладке Настройки озаглавим график и изменим фон заголовка:

Шаг 2. Форматирование значений

Теперь мы можем как угодно видоизменять значения графика, чтобы сделать его более информативным и удобным для просмотра.

Начнем со значений по оси Y. В данный момент на оси отображаются четырехзначные числа, что не всегда удобно. Давайте заменим их на сокращенный вариант. Для этого введем следующую команду в поле Ось Y > Форматирование:

@value > 1000 ? @value/1000+' тыс.':@value

Где
@value > 1000 – условие, при котором значение должно быть больше тысячи (в нашем примере это все значения по оси Y);
@value/1000 – деление значения на 1000, если удовлетворяется условие;
+' тыс.' – добавление текста к значению.

 

Теперь заменим сокращенные названия месяцев по оси Х на полные названия. Для этого выполним следующую команду в поле Ось Х > Форматирование:

@value == 'Янв' ? @value = 'Январь' :@value && @value == 'Фев' ? @value = 'Февраль':@value && @value == 'Мар' ? @value = 'Март' :@value &&@value == 'Апр' ? @value = 'Апрель' :@value &&@value == 'Май' ? @value = 'Май' :@value &&@value == 'Июн' ? @value = 'Июнь' :@value &&@value == 'Июл' ? @value = 'Июль' :@value &&@value == 'Авг' ? @value = 'Август' :@value

Где
@value == 'Янв' – условие, при котором значение должно быть Янв;
@value = 'Январь' – замена значения новым (Январь) при удовлетворении условия;

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

  1. Нажмите на Подписи и поставьте галочку на Подписи точек/столбцов – отобразятся значения на точках графика:

  2. Теперь выделим значения жирным и добавим к ним слово шт. Для этого воспользуемся следующей командой:
    '<b>'+@value.y + '</b>' + ' шт.'
    Где
    '<b>'+@value.y + '</b>' - все значения по оси Y, обрамленные HTML тэгами, которые делают текст жирным;
    ' шт.' – добавленный текст.

Также, с помощью настроек, можно поменять цвет фона, добавить рамку и тень:

 

Related content

Продвинутое форматирование свойств виджетов
Продвинутое форматирование свойств виджетов
Read with this
Примеры форматирования
Примеры форматирования
More like this
Примеры
Read with this
Примеры форматирования
Примеры форматирования
More like this
Примеры форматирования
Примеры форматирования
More like this
Примеры форматирования
Примеры форматирования
More like this