16 281
правка
Node-RED Dashboards: различия между версиями
→Описание флоу
| Строка 85: | Строка 85: | ||
=== Описание флоу === | === Описание флоу === | ||
Пример панели состоит из двух вкладок: | Пример панели состоит из двух вкладок: | ||
# '''Tab 1''' вкладка с виджетами: | # '''Tab 1''' вкладка с виджетами: | ||
| Строка 97: | Строка 95: | ||
[[Image: nr-svg-dash-demo-cast.gif |300px|thumb|right| Пример SVG-панели Node-RED ]] | [[Image: nr-svg-dash-demo-cast.gif |300px|thumb|right| Пример SVG-панели Node-RED ]] | ||
В ноде '''SVG grahpics''' на вкладке '''Event''' описаны события, которые будут генерировать элементы <code>#buzzer-state</code> и <code>#buzzer-control</code>. В обоих | В ноде '''SVG grahpics''' на вкладке '''Event''' описаны события, которые будут генерировать элементы <code>#buzzer-state</code> и <code>#buzzer-control</code>. В обоих случаях на выход ноды '''SVG grahpics''' будет отправлено сообщение с информацией о событии и элементе, вызвавшим его. Сообщения с описанием событий обрабатываются нодой '''switch-events'''. | ||
На вкладке '''Binding''' ноды '''SVG grahpics''' описаны свойства, которые можно менять с помощью соответствующих сообщений: у элемента <code>#buzzer-state</code> будет меняться свойство '''fill''', а в элементе <code>#temperature > tspan</code> будет изменяться текст. Сообщения для изменения свойств генерируются нодами '''set-color''' и '''set-temperature''', которые содержат примерно такой код: | На вкладке '''Binding''' ноды '''SVG grahpics''' описаны свойства, которые можно менять с помощью соответствующих сообщений: у элемента <code>#buzzer-state</code> будет меняться свойство '''fill''', а в элементе <code>#temperature > tspan</code> будет изменяться текст. Сообщения для изменения свойств генерируются нодами '''set-color''' и '''set-temperature''', которые содержат примерно такой код: | ||