HowTo: Node Red - Crear una interfaz de usuario con nodos de panel

No sé si los cuadros de mando son EL (único) medio de hacer latir más rápido el corazón de un empollón, pero desde luego son un medio de hacer latir más rápido el corazón de un empollón. Para los que crecieron con Star Trek y similares, los cuadros de mando en forma de diagramas y gráficos son el epítome de la tecnología. Gracias a ciertos nodos, ahora puedes crear tú mismo esta sensación con NodeRed.

Porque una vez que has conseguido que tu SmartHome recoja todo tipo de datos sobre tus cuatro paredes, es natural que quieras presentarlos. Pero, ¿cómo? Al fin y al cabo, no puedes meter estos datos en un álbum de fotos como las últimas fotos de las vacaciones.

Una forma sencilla y también informativa y decorativa es presentar los datos disponibles a través del nodo dashboard para NodeRed. Además de varios elementos de visualización, también ofrece la posibilidad de interactuar con su sistema SmartHome. Puede establecer valores, accionar interruptores virtuales, activar acciones y supervisar su estado al mismo tiempo.

Puede encontrar una visión general de las distintas funciones del Nodo del Cuadro de Mando en el siguiente artículo


Requisitos

Artículos útiles:
Para que pueda instalar nuevos nodos, por supuesto, NodeRed ya debería estar instalado.
En los siguientes artículos se describe cómo preparar una RaspberryPi y luego instalar NodeRed en ella.

Los siguientes tres artículos describen lo que se debe hacer para preparar la RaspberryPi:
RaspberryPi: ¡configuración para nerdiys!
RaspberryPi – ¡La primera configuración!
RaspberryPi: controle el RaspberryPi a través de SSH

NodeRed: instalación de NodeRed en RaspberryPi
NodeRed – Instalar nuevos nodos

Herramienta requerida:
-No-

Material requerido:

En la siguiente lista encontrará todas las piezas que necesita para implementar este artículo.


Inicie sesión en la interfaz de configuración de NodeRed

Antes de que pueda editar su configuración de NodeRed, debe, si está activado, primero iniciar sesión en la interfaz de configuración de NodeRed.

Vista del cuadro de diálogo de inicio de sesión. Aquí debe ingresar los datos de inicio de sesión que especificó durante la configuración del inicio de sesión. Puedes encontrar información al respecto en el artículo NodeRed: configurar el inicio de sesión del usuario.

Instalar el nodo del tablero

Para poder utilizar los nodos del cuadro de mandos, es necesario crear el Nodo
nodo-rojo-tablero
instalar.
Cómo se instala su nodo en el artículo NodeRed – Instalar nuevos nodos descrito.
 
Vista durante la instalación del nodo "node-red-dashboard".

Resumen de los nodos de entrada y salida disponibles

Al instalar los nodos del cuadro de mandos, recibirá todo un paquete de nodos adicionales adecuados para mostrar e introducir diversos valores. Estos se muestran como de costumbre en la paleta de nodos situada a la izquierda del menú de configuración. A continuación encontrará información detallada sobre cada uno de los nodos.

Vista de los nodos del tablero en la paleta Nodos.

Nodo de botones y posicionamiento de los elementos en el salpicadero

El primer nodo y el más sencillo es el "nodo botón". Con su ayuda puedes colocar un botón en tu tablero. Esto funciona como un botón en el mundo real. Si se pulsa, envía un valor ajustable y un tema ajustable al nodo vinculado.

Los nodos de botón, por ejemplo, pueden utilizarse muy bien para desencadenar acciones. Por ejemplo, puede encender y apagar lámparas.

Sin embargo, antes de poder utilizar el nodo de botón, primero debe posicionarse en la rejilla de diseño del cuadro de mandos.

Además de las funciones de los nodos propiamente dichos, también puede configurarse para cada uno de ellos el posicionamiento en el diseño del cuadro de mandos posterior. El cuadro de mandos es, por tanto, un sitio web independiente que puede gestionarse de forma centralizada a través de la configuración del cuadro de mandos.

Al instalar los nodos del cuadro de mandos, se ha añadido una nueva pestaña al área de configuración de la izquierda. Puede reconocerla por el icono basado en un gráfico de barras. Haz clic en él para abrir la configuración básica del cuadro de mandos.

Aquí puede ver las distintas pestañas "Diseño", "Tema" y "Sitio" en la zona superior. A la derecha hay una flecha que apunta hacia arriba y a la derecha. Si hace clic en esta flecha, será redirigido a la página web del panel de control.

Accede a la página del panel haciendo clic en el símbolo marcado con el puntero del mouse en la pestaña del panel.

También puede ir directamente a la página del panel de control. Para ello, simplemente añada un "/ui/" a la dirección de su página de configuración de NodeRed. Por ejemplo, si la dirección de su página de configuración de NodeRed es
https://192.168.172.5:1880
entonces la dirección es a su tablero
https://192.168.172.5:1880/ui/

En primer lugar, se trata de la división del diseño. Gracias a ella, puede colocar los respectivos elementos de entrada y salida (nodos del cuadro de mandos) casi libremente en el cuadro de mandos. El cuadro de mandos ofrece la posibilidad de combinar nodos individuales del cuadro de mandos en grupos. A continuación, se puede establecer el orden de visualización de estos nodos en el cuadro de mandos. Además, estos nodos agrupados pueden o deben asignarse a una "pestaña" específica.

Además de la pestaña "Casa", se pueden crear otras pestañas. Esto resulta práctico, por ejemplo, para separar virtualmente los elementos de las distintas habitaciones de un sistema Smart Home. Por ejemplo, se pueden combinar todos los sensores y actuadores del salón en una pestaña llamada "Salón". Esto facilita la visión de conjunto y aporta estructura al número de nodos, a menudo en rápido aumento.

Esto es también lo que puede ver y establecer en la pestaña "Diseño" de la configuración del cuadro de mandos. Allí se muestran todas las pestañas y los grupos asociados. En la siguiente captura de pantalla

Área "Diseño" de la configuración del Dashboard. Aquí puedes ver parte de las pestañas individuales (en este ejemplo "Home", "Raspi data", "Settings" y "Tasmota status"). También puede ver los grupos. Por ejemplo, la pestaña "Datos Raspi" incluye los grupos "1" y "2". A continuación, cada grupo contiene los elementos reales del Cuadro de mandos que se le han asignado. Puede hacerlos visibles haciendo clic en la pequeña flecha que apunta a la derecha.
Vista de la pestaña "Tema" de la configuración del salpicadero. Aquí puede establecer el estilo, el color base y el tipo de letra utilizados en el salpicadero.
En la pestaña "Sitio" de la configuración del salpicadero, también puede establecer el título de la página del salpicadero y otras opciones.

Otro ejemplo:

En esta vista general del diseño puede ver que hay dos pestañas llamadas "Configuración" y "Inicio". En la pestaña "Configuración", por ejemplo, encontrará los distintos grupos como "Servidor", RasPi" o "Estado". En la pestaña "Inicio", por otro lado, sólo encontrará el grupo "Predeterminado". En el grupo ampliado "Servidor" también puede ver cómo están dispuestos los elementos individuales como "Reiniciar servidor" o "Apagar pantalla".
Ahora encontrará de nuevo estas pestañas y grupos en la vista del panel de control. En la vista mostrada, se encuentra en la pestaña "Configuración". El primer marco rojo marca el grupo "Servidor". El grupo "Banda LED" está marcado con el segundo marco rojo. La flecha roja grande en el lado izquierdo también marca el símbolo en el que debe hacer clic para cambiar a otra pestaña.
Haga clic en este símbolo para ver todas las pestañas disponibles, en este caso "Configuración" e "Inicio".

El nodo de botón

El nodo botón es uno de los nodos más sencillos. Puede utilizarse para construir botones virtuales. Para ello, arrastre el nodo botón desde la paleta de nodos al área de configuración de NodeRed. Si ahora hace doble clic sobre el nodo, podrá configurar las siguientes opciones.

Grupo" define el grupo y la pestaña en los que debe situarse el botón. En este ejemplo, el botón se sitúa en la pestaña "TestTab" del grupo "TestGroup". Con "Tamaño" puede definir el tamaño del botón. Puede ver un ejemplo de diferentes tamaños más abajo en el artículo. También puede utilizar el ajuste "Icono" para mostrar iconos en el botón. Para obtener una selección de los iconos disponibles, basta con hacer clic en el enlace "Icono Material Design" situado a la derecha en la barra de información. "Etiqueta" indica el texto del botón. "Color" y "Fondo" permiten configurar el color del botón y el texto del botón. La configuración de "Carga útil" y "Tema" define qué valor (carga útil) se envía a través de qué tema en cuanto se pulsa el botón. Por último, una función muy importante: marcando o desmarcando "Si el mensaje llega a la entrada, pasarlo a la salida" puede activar o desactivar el reenvío de un mensaje recibido en la entrada del nodo del botón a la salida. Con "Nombre" puede establecer el nombre del nodo para la configuración de NodeRed como de costumbre.
Esta es la vista que se obtiene al hacer clic en el pequeño lápiz (editar) junto a la sección de grupo en la ventana anterior. Entonces llegará a la ventana en la que se puede asignar grupo y pestaña al nodo botón (o a cualquier otro nodo del cuadro de mandos). En principio, en esta ventana se editan las propiedades de todo el grupo. Puede establecer la pestaña asignada (en "Pestaña") y la anchura del grupo (en "Anchura"). También puede activar o desactivar la visualización del nombre del grupo y establecer si debe ser posible "plegar" el grupo, es decir, ocultar el contenido.
En la vista general del cuadro de mandos, todas las pestañas que contiene se muestran en una vista de página desplegable. Puede pasar de una a otra haciendo clic en la pestaña correspondiente.
La vista de los distintos botones grandes del salpicadero. 

nodo desplegable

El nodo desplegable es un nodo con el que puede crear una lista de selección en el Cuadro de Mando. Por ejemplo, puede crear una lista de temperaturas disponibles para un radiador. Sin embargo, también puede definir todo tipo de otras entradas con diferentes nombres y los valores correspondientes.

Para ello, arrastre un nodo desplegable de la paleta Nodo a la interfaz de configuración Nodo Rojo y haga doble clic sobre él.

Aparece entonces la ventana que se muestra. Aquí, como antes con los otros nodos, se puede ajustar el grupo y la pestaña asignados, así como el tamaño. También, como antes, la "Etiqueta". En este caso, "Etiqueta" significa el nombre para la lista desplegable en el panel de control real. En "Marcador de posición" se puede configurar un marcador de posición que se mostrará mientras no se haya seleccionado ningún valor en la lista desplegable. Las cosas se ponen realmente interesantes en la sección "Opciones". Aquí puede configurar las opciones disponibles de su lista desplegable. Para ello, se establece el nombre de la entrada correspondiente en la columna de la derecha y el valor de la entrada correspondiente en la columna de la izquierda. Puede añadir más entradas haciendo clic en "+opción". Las tres pequeñas líneas horizontales situadas a la izquierda de cada entrada también permiten cambiar el orden de las entradas. Para ello, basta con hacer clic en las líneas de la entrada que desee desplazar y mantener pulsado el botón del ratón. Moviendo el puntero del ratón hacia arriba o hacia abajo podrá cambiar la posición de la entrada marcada. Las demás funciones mostradas se comportan exactamente igual que las descritas para el "Botón".
Vista de la lista desplegable configurada en el tablero.
Si ahora hace clic en el campo de selección, podrá elegir entre las distintas entradas previamente configuradas.

cambiar de nodo

El nodo de conmutación corresponde en principio a un conmutador virtual. Puede utilizarse para enviar señales de conmutación o para indicar estados de conmutación.

Para ello, arrastre el nodo de conmutación desde la paleta Nodo a la interfaz de configuración Nodo Rojo y haga doble clic sobre él.

Aparece entonces la ventana que se muestra. Aquí, como antes con los otros nodos, se puede ajustar el grupo y la pestaña asignados, así como el tamaño. También, como antes, la "Etiqueta". En "Icono" puede seleccionar un icono que puede mostrar delante de la etiqueta o sin etiqueta como símbolo de conmutación. Las demás propiedades como "Tema" y "Nombre" son las mismas que para los nodos anteriores. La única diferencia aquí es que puede introducir diferentes cargas útiles para los estados de conmutación "Activado" y "Desactivado". Esto tiene sentido, ya que de otro modo no podría distinguir entre los estados "apagado" y "encendido".
Vista del interruptor encendido.
Vista del interruptor apagado.

nodo deslizante

El nodo deslizante es ideal para establecer números dentro de un cierto rango. Un buen caso de uso, por ejemplo, es usarlo como atenuador de una lámpara.

Para utilizar el nodo deslizante, primero debe arrastrarlo desde la paleta Nodo hasta la interfaz de configuración Nodo Rojo y abrir su menú de configuración haciendo doble clic sobre él.

Como ya se sabe de los otros nodos, la ventana de configuración aparece de nuevo tras hacer doble clic. Aquí, como antes, se puede ajustar el grupo y la pestaña asignados, así como el tamaño. También, como antes, la "Etiqueta". En la sección "Rango" se puede establecer el rango de valores que debe barrer el deslizador. Este rango va desde "min"=el valor mínimo hasta max=el valor máximo. La anchura del paso puede establecerse mediante "paso". El resto de propiedades como "Tema" y "Nombre" son las mismas que para los nodos anteriores. La única diferencia aquí es que la carga útil viene determinada, por supuesto, por el "valor del deslizador" actual.
Vista del control deslizante en el tablero.

nodo numérico

El nodo numérico es otra forma de pasar valores numéricos a Nodo-Rojo para su procesamiento.

Para configurarlos, arrastre un nodo numérico de la paleta Nodo a la interfaz de configuración Nodo Rojo.

Las opciones de configuración de este nodo son las dos propiedades "Formato de valor" y "Rango". Con "Rango" puede definir el rango posible de números y establecer el tamaño del paso, igual que hizo con el nodo deslizador. Con "Formato del valor" puede dar formato a la visualización del valor. Por ejemplo, puede añadir un signo de unidad después de "{{valor}}" para que el cuadro de mandos no sólo muestre el valor numérico, sino también un valor numérico más la unidad. Por ejemplo, también puede marcar un valor de temperatura como temperatura con "°C".

Nodo de entrada de texto

El nodo de entrada de texto es -como su nombre indica- un nodo para habilitar la entrada de texto.

Además de las opciones de configuración habituales, como "Grupo", "Tamaño", "Etiqueta", "Tema" y "Nombre", se pueden establecer para este nodo el "Modo" y un "Retardo". En "Retraso" se establece el tiempo que se espera tras la última entrada de caracteres hasta que los caracteres introducidos en el campo de texto se envían al siguiente nodo.
En "Modo" puede seleccionar qué datos deben introducirse en el campo correspondiente. Puede elegir entre las distintas opciones mostradas y adaptar así el campo de entrada perfectamente a la finalidad respectiva.
Vista (de aspecto relativamente simple) del nodo de texto en la vista del tablero.

Nodo selector de fecha

El date-picker-node básicamente hace exactamente lo que su nombre sugiere: Con él puedes seleccionar una fecha determinada y pasársela a NodeRed para su posterior procesamiento.

No se puede configurar ninguna otra opción (aparte de las habituales) para este nodo. Tras introducir una fecha en el cuadro de mandos, se reenvía al flujo conectado mediante carga útil.
Vista del selector de fecha en el tablero.

Nodo selector de color

El nodo selector de color es ideal para ajustar el color de una lámpara RGB conectada. Por supuesto, también puedes utilizarlo para transferir colores a Nodo-Rojo para su posterior procesamiento en todos los demás casos.

Además de las "opciones de configuración habituales", el nodo del selector de color tiene la opción de configuración "Formato" y también varias casillas de verificación que puede activar o desactivar. El formato del color de salida puede ajustarse mediante la propiedad "Formato". Puede elegir entre XXXXXXX y XX. Activando la propiedad "Mostrar control deslizante de tonalidad" o "Mostrar control deslizante de luminosidad" también puede mostrar un control deslizante para ajustar el valor de TONO o de luminosidad. A través de las casillas de verificación "Mostrar siempre muestra", "Mostrar siempre selector" y "Mostrar siempre campo de valor" también puede configurar la visualización permanente de diferentes "variantes del selector". Sólo tienes que probar qué vista te gusta más 🙂 .
Tu selector de color en el panel de control podría tener este aspecto.

nodo de formulario

Con el nodo formulario tiene la posibilidad de configurar un formulario típico. Esto le permite combinar diferentes opciones de entrada. Esto es perfecto, por ejemplo, para configurar un formulario para introducir una dirección o similar.

Además de las opciones de configuración habituales, puede configurar los elementos del formulario que se muestran aquí en el área "Elementos del formulario". Puede añadir campos de texto para diversos contenidos, como texto o números. Además, en ellos se puede almacenar contenido estándar o especificar si se trata de un campo obligatorio o no. Por último, pero no menos importante, también puede añadir su propio texto a los botones de confirmación y cancelación.
Vista del formulario de prueba en el tablero.

Nodo de salida de texto

El nodo de salida de texto es ideal para mostrar simplemente texto. Por ejemplo, puede mostrar valores medidos de sensores. El usuario no tiene posibilidad de editar el texto mostrado.

En consecuencia, sólo se pueden realizar relativamente pocos ajustes en las propiedades del nodo de salida de texto. Además del "Formato de valor", en el que puede ampliar el aspecto de la salida de texto con información adicional como símbolos de unidad, también tiene la opción de editar la disposición de la salida de texto. Puede elegir entre cinco disposiciones diferentes de la etiqueta y el texto. Pruebe cuál se adapta mejor a su presentación.
Vista del nodo de salida de texto en la vista del tablero.

nodo de calibre

El nodo calibrador es perfecto para visualizar los valores medidos. De este modo, los valores medidos pueden clasificarse visualmente de forma directa. También se pueden definir intervalos numéricos en los que cambia el color de la escala visualizada. Por ejemplo, puede mostrar las temperaturas altas/peligrosas en rojo. En cambio, las temperaturas dentro del intervalo normal se muestran con una escala verde. Esto permite hacerse una idea rápida de si las lecturas mostradas son correctas o no. Además, tiene un aspecto muy chulo (tipo Star Trek) 🙂 .

Además de las opciones de configuración habituales, puede establecer el "Tipo", el "Formato de valor", las "Unidades", el "Rango", los "Degradados de color" y los "Sectores" para el nodo del calibrador. Ya conoce "Etiqueta" y "Formato de valor" de los nodos anteriores. La propiedad "Unidades" le permite definir la unidad mostrada. Con la ayuda de la propiedad "Rango" puede definir el rango de valores a mostrar. Por ejemplo, si desea visualizar un valor de humedad, este rango debe ir de 0 a 100%. Para un rango de temperatura exterior, debe seleccionar un rango de temperatura que normalmente no se supere o no se sobrepase. Por ejemplo de -20°C a 45°C. Con la propiedad "Gradiente de color" puede definir ahora los colores que se mostrarán en función del valor medido. En este ejemplo, el color verde se muestra para todas las lecturas bajas, el color amarillo para todas las medias y el color rojo para todas las altas. Normalmente, los puntos en los que los colores cambian al siguiente están distribuidos uniformemente. Sin embargo, si desea una escala diferente o incluso omitir el color medio, puede definir con el ajuste "Sectores" en qué puntos deben cambiar los colores.
En "Tipo" puede seleccionar el tipo de indicador que desea visualizar. Aquí puedes ver ejemplos de los tipos disponibles.
Vista del manómetro tipo "Gauge" en el cuadro de mandos.
Vista del manómetro tipo "Donut" en el cuadro de mandos.
Vista del indicador tipo "Brújula" en el salpicadero.
Vista del indicador de tipo "Nivel" en el cuadro de mandos.

nodo gráfico

El nodo gráfico es adecuado para visualizar curvas de valores. Por ejemplo, puede guardar y mostrar el curso de una temperatura durante un periodo de tiempo determinado. Por desgracia, los valores sólo se guardan temporalmente. Esto significa que si su servidor NodeRed se bloquea o se reinicia, todos los valores mostrados anteriormente se perderán.

En comparación con los nodos anteriores, este nodo ofrece algunas opciones de configuración más. Aquí puede seleccionar primero en "Tipo" para establecer el tipo de diagrama. Puede resaltar los valores medidos individuales en cada representación colocando una marca debajo de "ampliar punto está ajustado. La resolución o la duración del curso de los datos en el eje X (el eje horizontal que va de izquierda a derecha) puede ajustarse con el parámetro "Etiqueta del eje X" Configurar. Aquí puede especificar durante cuánto tiempo o cuántas lecturas deben mostrarse. Por ejemplo, puede seleccionar que se muestren todos los valores medidos de las últimas dos horas o los últimos 500 valores medidos. Además, con "Etiqueta del eje X" luego configure también el etiquetado del eje X. Con "Eje Y" sólo se puede ajustar el rango de valores visualizados del eje Y. Si, por ejemplo, sólo desea ver el rango de valores de 0° a 30°C para una curva de temperatura, debe introducirlo aquí. Con ayuda de la opción "Leyenda" también puede configurar una leyenda, lo que resulta especialmente práctico cuando se visualizan varias curvas. De este modo, puede mostrar una descripción para cada color de curva. La opción "Interpolar" decide cómo se conectan entre sí los distintos valores medidos. Por último, puede establecer los colores utilizados para las curvas con "Colores de la serie" y el texto que se mostrará con "Etiqueta en blanco" si no hay valores medidos disponibles para la curva.
Vista del nodo del gráfico en el tablero.

nodo de salida de audio

El Audio-Out-Node es otro de estos nodos que hace exactamente lo que su nombre sugiere. Da salida al texto como lenguaje hablado.

Para ello, puedes seleccionar la "Voz TTS" (=voz "Text-To-Speech") en las propiedades del nodo. Esto te permite adaptar la salida de voz un poco más a tu estilo. En última instancia, este nodo emite por voz cualquier texto que le envíes. Sin embargo, es importante que esta voz no se emita localmente en el servidor del Nodo Rojo, sino en el navegador del usuario que acaba de abrir el panel. Si no hay ninguna ventana del navegador abierta en el momento de enviar el mensaje de voz, éste no se emitirá. Se puede realizar una salida local en el servidor NodeRed a través de altavoces conectados con el programa "Espeak". Encontrará más información al respecto en el artículo RaspberryPi - Instalar salida de voz con eSpeak.

nodo de notificación

El nodo de notificaciones permite mostrar notificaciones en el panel de control abierto. Estas pueden mostrarse como información en el borde o centradas en el centro de la pantalla, incluyendo un botón de confirmación.

En la ventana de configuración del nodo de notificación, puede establecer la posición del campo de notificación en "Diseño". Entre otras cosas, existe la opción "Diálogo Aceptar/Cancelar", que permite dotar a la notificación de dos botones. Estos deben ser confirmados por el usuario. De esta forma puede estar seguro de que el usuario ha visto la notificación. Para ello, puede especificar en "Etiqueta de acción predeterminada" y "Etiqueta de acción secundaria" lo que debe aparecer en los botones "Confirmar" y "Cancelar".
Además de la variante de notificación que el usuario debe confirmar, también existe la opción de mostrar la notificación sólo como nota. Para ello, seleccione, por ejemplo, "Arriba a la derecha" en "Diseño". Si a continuación envía una notificación al nodo, ésta se mostrará en la esquina superior derecha y volverá a desaparecer automáticamente al cabo de unos segundos.
Vista de una notificación que debe confirmarse para que vuelva a desaparecer.
Vista de una notificación en la esquina superior derecha.

nodo de control de la interfaz de usuario

Con el nodo de control UI puedes controlar la apariencia y el comportamiento de la vista del cuadro de mandos. Por ejemplo, puede utilizarlo para cambiar la pestaña mostrada y para "expandir y contraer" grupos. También puede utilizar este nodo para reaccionar a si un usuario ha abierto o cerrado el cuadro de mando.

Para este nodo, sólo se puede configurar el nombre en la ventana de ajustes. Todos los parámetros ajustables o la información disponible también se resumen en la barra de información lateral.

nodo de plantilla

El nodo de plantilla es un nodo muy versátil. Puede utilizarlo para integrar su propio código HTML en el cuadro de mandos. Éste puede reaccionar individualmente a los mensajes recibidos de los nodos conectados y también enviar mensajes por sí mismo.

Utilizando el nodo de plantilla, puede añadir contenido a la cabecera de la página...
...o añadir nodos a grupos que hayas formateado con tu propio código HTML.

thztjz

Con la ayuda de este nodo, puede, por ejemplo, insertar enlaces a cualquier página del Panel de Control. En este ejemplo, el enlace a la vista MagicMirror se genera y se muestra en el Dashboard.
Aparecerá un enlace en el panel de control que le llevará a la vista MagicMirror.

Más ejemplos

A continuación encontrarás una pequeña lista de artículos en los que también uso los nodos del salpicadero. Tal vez haya algo para ti también 🙂 .


Información adicional

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

Diviértete con el proyecto.

Espero que todo te haya funcionado como se describe. Si no es así, o si tiene alguna pregunta o sugerencia, hágamelo saber en los comentarios. Si es necesario, lo añadiré al artículo.
Las ideas para nuevos proyectos siempre son bienvenidas. 🙂

PS Muchos de estos proyectos, especialmente los proyectos de hardware, cuestan mucho tiempo y dinero. Por supuesto que hago esto porque lo disfruto, pero si crees que es genial que comparta la información contigo, me encantaría hacer una pequeña donación al fondo del café. 🙂

Cómprame un café en ko-fi.com       

7s comentarios

  1. Hola, gran artículo. Una pregunta sobre esto: ¿Cómo logra organizar los elementos uno al lado del otro dentro de un grupo, como el botón de encendido y apagado en su grupo de tiras LED?

    Atentamente
    Andrés

    1. Hola Andreas,
      gracias 🙂
      En realidad, esto debería suceder automáticamente tan pronto como ambos elementos encajen uno al lado del otro en el grupo. Para ello hay que poner el ancho de los elementos (los botones en el caso de la LED Stripe) a 3, por ejemplo, para que encajen en el grupo (aquí “LED Stripe”) con un ancho de 6 siguiente el uno al otro 🙂
      Por favor, hágamelo saber si funcionó. 🙂
      Atentamente
      Fab

  2. Buen día,

    excelente articulo, me ayudo mucho. Todavía tengo una pregunta general sobre un tablero de Node-Red.

    Construí uno y leí datos de un sensor de temperatura a través de Node-Red. Conecté esto al RPi. (Node-red se ejecuta en mi RPi).

    También se puede acceder fácilmente a este tablero a través del navegador que uso. Pero solo si estoy en la misma red que la Raspberry Pi.
    No tengo acceso al tablero desde la red de Internet de mi teléfono inteligente.

    ¿Conoce alguna forma en que pueda acceder al tablero desde la red "pública" o desde otras conexiones a Internet que no sean mi WiFi en casa?

    Gracias y un saludo, Lennard.

    1. Hola Lennard,
      Gracias. 🙂
      La (única opción razonablemente) segura es conectarse a su red doméstica a través de una VPN y así acceder a la RaspberryPi en su red.
      Mientras tanto, muchos enrutadores (por ejemplo, el Fritzbox) se pueden configurar como servidores VPN.
      Desafortunadamente no tengo un tutorial listo para esto, pero probablemente. encuentras algo al respecto? 🙂
      Atentamente
      Fabian

  3. Hola,
    He estado trabajando con Node-Red en Raspy-400 durante unos días. Un convertidor AD (ADS1115) también me da resultados limpios. Me gustaría cambiar el tamaño de fuente para los nodos del tablero. es posible? Algunos códigos están publicados en otros sitios, pero no funcionan. ¿Tiene un ejemplo para mí (por ejemplo, para calibre) cómo hacer eso?

    Me gustaría darle las gracias de antemano, solo por el artículo del tablero.
    Atentamente
    H.Harle

    1. Hola Horst,
      Desafortunadamente, no tengo un ejemplo para esto, pero probablemente. un "empujón" en la dirección correcta. La descripción del nodo para el nodo de indicador contiene la siguiente nota:

      Si se especifica una Clase, se agregará a la tarjeta principal. De esta manera, puede diseñar la tarjeta y los elementos dentro de ella con CSS personalizado. La clase se puede configurar en tiempo de ejecución configurando una propiedad de cadena msg.className.

      Eso significa que en realidad debería poder editar la apariencia de los componentes individuales del nodo de calibre con código CSS.
      Espero que esto te ayude más. 🙂
      Atentamente
      Fab

Kommentar hinterlassen

Tu dirección de correo electrónico no será publicada. Erforderliche Felder sind mit * markiert

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