16 281
правка
SVG-Dashboards: различия между версиями
м
→Подготовка
м (→Style) |
м (→Подготовка) |
||
| Строка 25: | Строка 25: | ||
Изображение может быть любого размера и с любым количеством элементов. | Изображение может быть любого размера и с любым количеством элементов. | ||
== Синтаксис == | |||
В полях '''Value''' [[#Редактор связей | Редактора связей]] можно составлять простые выражение, которые содержат ветвление и простые арифметические операции. | |||
=== Значение MQTT-топика === | |||
Полученное из MQTT-топика значение содержится в переменной '''val'''. | |||
=== Условные выражения === | |||
Доступные операции: | |||
* <code>></code> — больше | |||
* <code>>=</code> — больше или равно | |||
* <code><</code> — меньше | |||
* <code><=</code> — меньше или равно | |||
* <code>==</code> — равно | |||
* <code>!=</code> — не равно | |||
Синтаксис: | |||
<pre> | |||
(УСЛОВИЕ) ? 'ЗНАЧЕНИЕ1' : 'ЗНАЧЕНИЕ2' | |||
</pre> | |||
Например, если значение MQTT-топика будет равно <code>1</code>, то вывести значение <code>ВКЛ</code>, иначе — <code>ОТКЛ</code>: | |||
<pre> | |||
(val == 1) ? 'ВКЛ' : 'ОТКЛ' | |||
</pre> | |||
=== Арифметические операции === | |||
Над полученным из MQTT-топика можно совершать простые арифметические операции: | |||
* <code>+</code> — сложение | |||
* <code>-</code> — вычитание | |||
* <code>*</code> — умножение | |||
* <code>/</code> — деление | |||
Например, окрасим svg-элемент в красный цвет, если значение в MQTT-топике, умноженное на 0.1 больше 20: | |||
<pre> | |||
(val*0.1>20) ? 'fill: red' : '' | |||
</pre> | |||
== Создание SVG-панели == | == Создание SVG-панели == | ||