Виджет "Диалоговое окно KPI" (с поддержкой тем)
Отображает значения ключевого индикатора производительности (KPI) с помощью одной из нескольких компоновок, таких как круговая шкала, горизонтальный столбик или вертикальный столбик. Можно применить форматирование состояния, чтобы подсветить одно или несколько целевых значения KPI.
 |
Этот виджет также доступен как веб-компонент в библиотеке SDK веб-компонентов ThingWorx.
|
Анатомия
1. Метка виджета
2. Средство отслеживания форматирования состояния
3. Значение KPI
4. Метка единицы измерения
5. Средство отслеживания значений
Компоновки виджета
В дополнение к компоновке круговой шкалы можно настроить виджет для отображения значения KPI с помощью одной из следующих компоновок:
Горизонтальная полоса
Вертикальный столбик
Применение форматирования состояния
Можно применить форматирование состояния к виджету, чтобы показать дугу целевых значений. Дуга разделяется на сегменты, каждый из которых представляет различное состояние или диапазон значений KPI. Можно применить правила форматирования состояния для стиля виджета в соответствии с текущим значением KPI. Чтобы применить форматирование состояния, выполните следующие шаги.
1. В Composer создайте сущность определения состояния, которая применяет определения стилей на основе диапазона числовых значений.
2. В Mashup Builder выберите виджет, а затем откройте панель Свойства.
3. Настройте свойство, TargetFormat щелкнув Форматирование состояния.
4. В диалоговом окне Форматирование состояния выберите Определения стилей на основе состояния.
5. В разделе Зависимое поле выберите Value.
6. Выберите определение состояния, созданное на шаге 1, а затем щелкните Готово.
7. Сохраните, а затем просмотрите мэшап.
Правила форматирования состояния во время выполнения применяются к виджету на основе примененных определений стилей и текущего значения. В следующем примере показана круговая шкала с форматированием состояния, примененным к виджету. Дуга форматирования состояния разделяется на три диапазона значений KPI.
Дополнительно можно показать значок статуса для каждого состояния, определенного в определении состояния. По умолчанию значок отображается справа от виджета. Можно использовать свойство IconPosition, чтобы задать положение значка слева. Чтобы задать максимальный размер для значка, используйте свойство MaxIconSize.
Дополнительные сведения о форматировании состояния см. в разделе Применение форматирования состояния к виджетам.
Настройка начального и конечного углов круговой шкалы
Можно сконфигурировать начальный и конечный угол дуги круговой шкалы, используя свойства StartAngle и EndAngle. Свойство StartAngle задает начальную точку дуги трекера. Оба свойства поддерживают значение от 0 до 360 градусов. По умолчанию дуга рассчитывается от позиции 6 часов по часовой стрелке между 45 и 315 градусами. Можно изменить направление дуги, используя свойство Direction виджета. В следующем примере показан трекер круговой шкалы с начальным углом 90 градусов и конечным углом 270 градусов.
Форматирование значения KPI
Некоторые свойства конфигурации позволяют форматировать значение KPI. С помощью конфигурации UnitOfMeasure можно указать единицу измерения для значения KPI. Эта единица измерения отображается во всплывающей подсказке при наведении указателя на значение KPI. Если для свойства ShowUOMLabel задано значение true, виджет отображает единицу измерения (UOM) рядом со значением KPI. Конфигурация ValueFormat позволяет задавать десятичный формат для числового значения KPI с использованием синтаксиса 0.000.
Свойства виджета
Имя свойства | Описание | Базовый тип | Значение по умолчанию | Привязывание | Локализация |
|---|---|---|---|---|---|
Clicked | Доступное для связывания событие, которое инициируется, если щелкнуть виджет. | Событие | Д | Н | |
ValueFormat | Применяет форматирование состояния к виджету и значению KPI с использованием сущностей определения состояния. | Определение состояния | 0000 | Д | Н |
Label | Указывает текст метки виджета. | STRING | Метка | Д | Д |
Layout | Управляет типом компоновки, используемой для отображения значения KPI в виджете. Опции: Круговая шкала.Горизонтальная полоса, Вертикальный столбец | STRING | Круговая шкала | Н | Н |
StartAngle | Задает начальный угол значения и целевых трекеров на шкале относительно нуля, начиная с позиции "6 часов". Можно ввести положительные углы от 0 до 360.Используйте свойство Direction, чтобы задать угловое направление. | NUMBER | 45 | Н | Н |
EndAngle | Задает конечный угол значения и целевых трекеров на циферблате относительно нуля, начиная с позиции "6 часов". Можно ввести положительные углы от 0 до 360. Используйте свойство Direction, чтобы задать угловое направление. | NUMBER | 315 | Н | Н |
Direction | Указывает направление трекера значений на круговой шкале, вертикальном столбике или горизонтальной полосе. Опции Круговая шкала: по часовой стрелке/против часовой стрелки По горизонтали: слева направо или справа налево По вертикали: снизу вверх/сверху вниз | STRING | Круговая шкала: По часовой стрелке По горизонтали: Слева направо По вертикали: Снизу вверх | Н | Н |
IconPosition | Указывает положение значка статуса KPI относительно метки значения. Можно указать значки для отображения с помощью форматирования состояния. | STRING | Справа | Д | Н |
LabelAlignment | Управляет выравниванием метки виджета. Опции: По левому краю, По центру, По правому краю | STRING | По левому краю | Д | Н |
IconSize | Задает размер значка статуса KPI. Опции: Мелкий, Средний, Большой, Огромный | STRING | Малый | Д | Н |
LabelType | Задает тип для метки. Опции: Надпись, Основной текст, Метка, Название, Крупное название, Подзаголовок, Заголовок, Крупный заголовок | STRING | Метка | Н | Н |
MinimumValue | Задает минимальное значение KPI для отображения в виджете. | NUMBER | 0 | Д | Н |
MaximumValue | Задает максимальное значение KPI для отображения в виджете. | NUMBER | 100 | Д | Н |
UnitOfMeasure | Указывает единицу измерения для значения KPI. Единица измерения отображается во всплывающей подсказке. | STRING | Пустой | Д | Д |
ShowUOMLabel | Отображает единицу измерения рядом со значением KPI. | BOOLEAN | False | Д | Н |
Value | Задает значение KPI. | NUMBER | Пустой | Д | Н |
Свойства проверки
Имя свойства | Описание | Базовый тип | Значение по умолчанию | Доступно для связывания (Д/Н)? | Локализуемое (Д/Н) |
|---|---|---|---|---|---|
ValidationState | Связываемое свойство, которое задает состояние проверки. Для этого свойства можно задать значение Undefined, Unvalidated, Valid или Invalid. | STRING | Undefined | Д | Н |
ValidationOutput | Загружает выходные данные проверки виджета. Возвращаемые значения: Undefined, Unvalidated, Valid или Invalid. | STRING | Д | Н | |
Validate | Связываемое событие, которое инициируется при изменении значения виджета. Привяжите это событие к сервису или функции, чтобы применить шаблон или выражение проверки. | Событие | Д | Н | |
CriteriaMessage | Сообщение, отображаемое при сбое проверки. | STRING | Пустой | Д | |
CriteriaMessageDetails | Дополнительное сообщение, расширяющее информацию сообщения о сбое. | STRING | Пустой | Д | Д |
ShowValidationSuccess | Показывать сообщение об успешном завершении проверки. | BOOLEAN | False | Д | Н |
SuccessMessage | Сообщение, отображаемое при успешном завершении проверки. | STRING | Д | Д | |
SuccessMessageDetails | Дополнительное сообщение, расширяющее информацию сообщения об успешной проверке. | STRING | Д | Д | |
ValidationSuccessIcon | Выбор значка SVG для отображения в сообщении о состоянии при успешном завершении проверки. | Список значков SVG | PTC Success | Н | Н |
ShowValidationFailure | Задает сообщение о сбое при сбое проверки. | BOOLEAN | False | Д | Н |
ValidationFailureIcon | Выбор значка SVG для отображения в сообщении о состоянии при сбое проверки. | Список значков SVG | PTC error | Н | Н |
MinValueFailureMessage | Сообщение, которое отображается, когда значение KPI меньше значения, заданного в свойстве MinimumValue. | Текстовое поле | <MinValue> is the minimum value. | Д | Д |
MaxValueFailureMessage | Сообщение, которое отображается, когда значение KPI превышает значение, заданное в свойстве MaximumValue. | Текстовое поле | <MaxValue> is the maximum value | Д | Д |