/
Добавление свойств пользовательского виджета

Добавление свойств пользовательского виджета

Описание

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

Примеры возможных настроек:

Пользовательский виджет

Свойства

Пользовательский виджет

Свойства

Speedometer

На панели справа выделены свойства, которые были добавлены разработчиком в раздел Пользовательские свойства при создании виджета.

speedometer.png

Sankey

На панели справа выделены свойства, которые были добавлены разработчиком в раздел Пользовательские свойства при создании виджета.

sankey-modified(1).png

Настройка

Пользовательские свойства

Чтобы добавить какие-либо свойства в раздел Пользовательские свойства настроек виджета, необходимо выполнить следующие шаги для каждого добавляемого свойства:

  1. В окне редактирования свойства нажмите кнопку Добавить новое свойство:

  2. В появившихся полях укажите название свойства, которое будет отображаться в интерфейсе, имя свойства, которое будет использоваться в коде виджета, тип данных и значение по умолчанию:

    Доступны следующие типы данных:

    • Строка – любой текст (в консоли браузера значение выводится в формате строки).

    • Число – числовое значение (в консоли браузера значение выводится в формате числа).

    • Чекбокс – логический тип данных (в консоли браузера выводится true или false).

    • Цвет – позволяет выбрать цвет по умолчанию с помощью стандартной палитры (в консоли браузера значение выводится в формате строки).

    • Шрифт – позволяет выбрать шрифт по умолчанию из стандартного набора шрифтов (в консоли браузера значение выводится в формате строки).

    • Выравнивание – позволяет задать выравнивание текста по умолчанию (в консоли браузера значение выводится в формате строки).
      Для нашего виджета мы добавили следующие свойства:

  3. Теперь необходимо “привязать” указанные свойства к коду виджета. Для этого вам нужно прописать имена свойств в соответствующих местах кода. В нашем примере это выглядит так:

Для того, чтобы виджет работал корректно, необходимо заменить в первой строке кода Highcharts.chart('container' на Highcharts.chart(w.general.renderTo

  1. После того, как выполнены все настройки, нажмите Готово:

    Все указанные свойства будут отображаться в Пользовательских свойствах виджета.

Расширенные свойства

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

  1. Укажите какое-либо свойство в поле Расширенные свойства JSON. В нашем примере мы укажем тип диаграммы:

     

  2. В коде виджета необходимо теперь “привязаться“ к этому свойству:

    Тип виджета теперь будет определяться корректно.

Ограничения

Изменения состава свойств пользовательских виджетов не применяется к уже добавленным ранее виджетам. Если вы поменяли свойства в уже добавленном на дашборд виджете и хотите, чтобы пользовательские настройки стали доступны, то необходимо добавить виджет заново.


Смотрите также

Создание пользовательского виджета

 

Related content

Добавление новых JS библиотек
Добавление новых JS библиотек
Read with this
Добавление свойств пользовательского виджета
Добавление свойств пользовательского виджета
More like this
Добавление свойств пользовательского виджета
Добавление свойств пользовательского виджета
More like this
Добавление свойств пользовательского виджета
Добавление свойств пользовательского виджета
More like this
Добавление свойств пользовательского виджета
Добавление свойств пользовательского виджета
More like this
Добавление свойств пользовательского виджета
Добавление свойств пользовательского виджета
More like this