Сравнение версий

Ключ

  • Эта строка добавлена.
  • Эта строка удалена.
  • Изменено форматирование.

Описание

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

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

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

Свойства

Speedometer

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

Image RemovedImage Added

Sankey

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

Image RemovedImage Added

Настройка

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

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

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

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

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

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

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

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

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

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

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

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

    Image RemovedImage Added
Примечание

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

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

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

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

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

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

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

    Image RemovedImage Added

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

Ограничения

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


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

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

На этой странице

Оглавление

🕑 Время чтения: 2 мин.


Нужна дополнительная помощь?

Свяжитесь с технической поддержкой.