Dashboard en Node-RED

Uno de los nodos más populares de Node-RED es el de dashboard, que  permite hacer un dashboard muy sencillo desde Node-RED.

Node dashboard: https://flows.nodered.org/node/node-red-dashboard 

Github: https://github.com/node-red/node-red-dashboard

Cómo usarlo:

El diseño del dashboard debe considerarse como una cuadrícula. Cada elemento del grupo tiene un ancho: de forma predeterminada, 6 ‘unidades’ (una unidad tiene 48 píxeles de ancho de forma predeterminada con un espacio de 6 píxeles).

Cada widget del grupo también tiene un ancho: de forma predeterminada, ‘auto’, lo que significa que ocupará el ancho del grupo en el que se encuentra, pero puede establecerlo en un número fijo de unidades.

El algoritmo de diseño del tablero siempre trata de colocar elementos tan altos y a la izquierda como sea posible dentro de su contenedor; esto se aplica a cómo se posicionan los grupos en la página, así como a cómo se colocan los widgets en un grupo.

Dado un grupo con un ancho de 6, si agrega seis widgets, cada uno con un ancho de 2, se colocarán en dos filas, tres widgets en cada uno.

Si agrega dos grupos de ancho 6, siempre que la ventana de su navegador sea lo suficientemente ancha, se sentarán uno al lado del otro. Si encoge el navegador, en algún momento el segundo grupo cambiará para estar debajo del primero, en una columna.

Es posible utilizar múltiples grupos si es posible, en lugar de un gran grupo, para que la página pueda cambiar de tamaño dinámicamente en pantallas más pequeñas.

Una descripción completa de los controles: https://flows.nodered.org/node/node-red-dashboard
Y se accede al dashboard con http://IP_NodeRED:1880/ui

Más información:

Tutoriales node red dashboard

Otro dashboard es el freeboard:

Web Estática

Web estatica: el modo httpstatic de settings.js me da la ruta de una web estáticas para mostrar por ejemplo una foto.

Se debe cambiar el valor de httpStatic para que sea la ruta completa a la carpeta que contiene sus imágenes o web estática.

Después de reiniciar el Node-RED, accederá al editor en http://localhost:1880/admin y podrá cargar la web estática con http://localhost:1880 

Servir una web statica: https://cookbook.nodered.org/http/serve-a-local-file

Más información: ttps://discourse.nodered.org/t/how-to-enable-ability-to-input-local-image-files-in-to-node-red-dashboard/3085

Securizar el Dashboard

Documentación: https://flows.nodered.org/node/node-red-dashboard

Puede usar la propiedad httpNodeAuth en su archivo Node-RED settings.js para securizar el panel de control, ya que se crea de la misma manera que otros nodos HTTP. Los detalles se pueden encontrar al final de esta página en los documentos http://nodered.org/docs/security 

Este Dashboard no es compatible con múltiples usuarios individuales. Es una vista del estado del flujo Node-RED subyacente, que en sí mismo es un solo usuario. Si el estado del flujo cambia, todos los clientes serán notificados de ese cambio.

Los mensajes provenientes del tablero tienen un msg.socketid, y las actualizaciones como cambio de pestaña, notificaciones y alertas de audio se dirigirán solo a esa sesión. Elimine el msg.sessionid para enviarlo a todas las sesiones.

La ruta de acceso al Dashboard de Node-RED se puede cambiar desde el campo httpNodeRoot se puede cambiar en la configuración.

Poner login con usuario y password en un dashboard para acceder con programación en Node-RED https://github.com/phyunsj/node-red-dashboard-login

Flow para poner un pin en Dashboard y confirmar una acción: https://flows.nodered.org/flow/7bcb0b049df4fa3c962294137ebaec19

Ejemplo Arduino + MQTT + NodeRed + Dashboard

Hacer un Dashboard como este usando dos sondas o dos potenciómetros que manden datos a varios topic y se muestre en el dashboard, así como un led que pueda encenderse al pulsar un botón del dashboard y dos leds que se enciendan cuando se supere el umbral de temperatura.

Además hacer una pestaña con las gráficas y hacer un flujo de debug para ver los datos.

Todos los datos serán guardarlos en la BBDD MariaDB instalada en las Raspberry Pi

Ejemplo hecho con 4 flujos:

Código node-red: https://github.com/jecrespo/Curso-IoT-Open-Source/blob/master/node-red/node-red.json 

Código Arduino: https://github.com/jecrespo/Curso-IoT-Open-Source/blob/master/node-red/arduino-node-red/arduino-node-red.ino

Un pensamiento en “Dashboard en Node-RED

  1. Pingback: Saber más Curso Raspberry Pi y Node-RED | Aprendiendo Arduino

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios .