16 281
правка
Node-RED Dashboards: различия между версиями
→Создание svg-панели
(с) |
|||
| Строка 48: | Строка 48: | ||
== Создание svg-панели == | == Создание svg-панели == | ||
=== Добавление вкладки === | |||
[[Image: node-red-svg-dashboard-1.png |250px|thumb|right| Переименованные элементы ]] | [[Image: node-red-svg-dashboard-1.png |250px|thumb|right| Переименованные элементы ]] | ||
Добавим новую вкладку и создадим в ней svg-панель: | Добавим новую вкладку и создадим в ней svg-панель: | ||
| Строка 61: | Строка 62: | ||
#* на вкладке '''SVG''' надо добавить код svg-изображения. | #* на вкладке '''SVG''' надо добавить код svg-изображения. | ||
=== Создание изображения === | |||
Создадим изображение в Inkscape: | Создадим изображение в Inkscape: | ||
# Откройте редактор и меню '''File''' → '''Document Properties'''. | # Откройте редактор и меню '''File''' → '''Document Properties'''. | ||
| Строка 68: | Строка 70: | ||
# Сохраните файл, откройте его в текстовом редакторе и скопируйте содержимое. | # Сохраните файл, откройте его в текстовом редакторе и скопируйте содержимое. | ||
=== Импорт изображения === | |||
Теперь вставьте код картинки в Node-RED: | Теперь вставьте код картинки в Node-RED: | ||
# Перейдите в настройки ноды '''SVG graphics''' и откройте вкладку '''SVG'''. | # Перейдите в настройки ноды '''SVG graphics''' и откройте вкладку '''SVG'''. | ||
| Строка 74: | Строка 77: | ||
Снова перейдите на страницу с панелью, теперь там должно появиться меню, кликните на него и выберите '''Tab 2'''. | Снова перейдите на страницу с панелью, теперь там должно появиться меню, кликните на него и выберите '''Tab 2'''. | ||
=== Привязка элементов === | |||