Cómo usar FUXA con Raspberry Pi PLC

En esta entrada de blog, exploraremos cómo usar FUXA con PLCs Raspberry Pi para crear una solución front-end que mejore el control y la monitorización.

Introducción

La Raspberry Pi es una plataforma versátil que se utiliza a menudo en diversas aplicaciones industriales. Su integración con Node-RED ofrece una forma intuitiva de controlar los pines GPIO y gestionar tareas de automatización. Sin embargo, para aquellos que deseen crear interfaces front-end más avanzadas y personalizables, FUXA es una excelente incorporación. Al combinar FUXA con Node-RED y MQTT, podrás construir una interfaz de usuario a medida para supervisar y controlar en tiempo real los PLCs basados en Raspberry Pi.

Requisitos de hardware

Para completar esta configuración necesitarás:​

• Un PLC Raspberry Pi de la familia Raspberry Pi PLC.
• Tarjeta Micro-SD insertada en el PLC Raspberry Pi.
• Cables para conectar y probar las funcionalidades de entrada/salida.

Requisitos de software

Las siguientes herramientas de software son necesarias para configurar tu sistema:

• Raspberry Pi OS: Instálalo en tu tarjeta Micro-SD. Recomendamos usar una de nuestras imágenes preconfiguradas para ahorrar tiempo, ya que incluyen muchos ajustes necesarios por defecto.
• Biblioteca Raspberry Pi PLC (rpiplc): Si no viene preinstalada, puedes instalarla siguiendo las instrucciones de instalación aquí.
• Servicio MQTT: Instala el broker MQTT (por ejemplo, Mosquitto) con el siguiente comando:

sudo apt install mosquitto

• Node-RED: Si Node-RED no está ya instalado, puedes hacerlo con el siguiente comando:

bash <(curl -sL https://raw.githubusercontent.com/node-red/linux-installers/master/deb/update-nodejs-and-nodered)

• FUXA: Instala el paquete FUXA de forma global con npm (para más opciones de instalación, consulta la documentación oficial):

npm install -g --unsafe-perm @frangoteam/fuxa-min

Establecer conexiones de pines con Node-RED

Paso 1: Acceder a Node-RED

Abre Node-RED navegando a la siguiente dirección en tu navegador web:

http://ip_raspberry_pi_plc:1880

Una vez allí, necesitarás instalar la biblioteca "node-red-librpiplc":

1. Ve a "Node-RED Menu -> Manage palette -> Install"
2. Busca "@industrial-shields/node-red-librpiplc" e instálala.

Paso 2: Configuración de pines de salida

1. Añade un nodo MQTT Input para escuchar mensajes en "localhost:1883" (el puerto por defecto de MQTT).
2. Configura el tema (topic) para escuchar las salidas usando el comodín "Q/#", que abarcará todos los pines de salida.
3. Añade nodos JSON y Debug para procesar y mostrar los mensajes MQTT.
4. Usa nodos Switch para gestionar diferentes zonas y salidas (por ejemplo, de Q0.0 a Q0.7 para el modelo RPIPLC_21).
5. Añade nodos Change para establecer valores en cada pin de salida. La carga útil (payload) debe estar configurada como"msg.payload.value".
6. Añade nodos Digital Write o Analog Write según la configuración de entrada/salida de tu Raspberry Pi PLC para gestionar la salida.
7. Finalmente, asegúrate de conectar todo como se muestra en el diagrama de ejemplo, de modo que las salidas estén correctamente gestionadas.

Paso 3: Configuración de pines de entrada

1. Añade un nodo Inject con la carga útil deseada y un tema apropiado (por ejemplo, "I/<pin_name>" para los pines de entrada). Configura el intervalo de inyección a 0,1 segundos para asegurar que las entradas se actualicen rápidamente.
2. Añade nodos Digital Read o Analog Read dependiendo de la configuración de entradas de tu modelo de PLC (por ejemplo, de I0.0 a I0.6 serán digitales y de I0.7 a I0.12 serán analógicas). Selecciona el modelo y la versión de tu RPIPLC y luego el nodo de salida correspondiente para cada uno.
   
3. Usa nodos Change para procesar los valores de las entradas, de forma similar a las salidas. Asegúrate de indexar correctamente cada pin de entrada. Para ello, sigue estos pasos:
4. 1. Añade un nodo Change y, en la opción "Set", selecciona JSON como formato. Establécelo en "{"value":payload}" para almacenar el valor de la entrada en "msg.payload".
      
   2. Haz clic en el botón Add para crear una nueva regla. Establece el campo en "msg.payload.index" y en "to the value" (al valor), introduce el índice correspondiente al pin específico.
   3. Duplica este nodo Change para cada entrada y edita los valores de índice según corresponda a cada pin.
   4. Añade otro nodo Change npara asignar la zona al grupo de pines de entrada. Conecta todos los nodos Change relacionados con las entradas a la entrada de este nodo. Modifica este nodo estableciendo "msg.payload.zone" con el valor correspondiente a la zona.
5. Añade nodos JSON y Debug conectados a la salida del último nodo Change.
6. Crea un nodo MQTT Output y configúralo con "localhost:1883". No escribas ningún tema (topic), ya que utilizaremos la configuración realizada para asignar los temas.
7. Conecta todos los nodos adecuadamente, asegurándote de que siguen el patrón establecido para las entradas.

Resultado final

El resultado final, con la configuración de entradas y salidas, debería lucir de forma similar a lo mostrado en el ejemplo:

Puedes descargar el siguiente JSON para importarlo desde "Node-RED Menu -> Import -> Clipboard option -> select a file to import", y buscar el JSON que acabas de descargar.

Node-RED json

Configuración de pines en FUXA

Paso 1: Iniciar FUXA

Para lanzar FUXA, ejecuta el siguiente comando:

sudo fuxa

Luego navega a la página del editor de FUXA:

http://ip_raspberry_pi_plc:1881/editor

Paso 2: Establecer conexión MQTT

1. Ve al "Setup" o "Edit Project" haciendo clic en el botón con forma de engranaje ubicado en la parte superior izquierda de la página:
2. En las opciones disponibles, selecciona "Connections":
3. Ahora estarás en la página "Device settings" Para conectar con los pines del PLC Raspberry Pi utilizaremos el protocolo MQTT, conectándonos a lo que previamente configuramos en Node-RED. Haz clic en el botón más (+) para añadir una nueva conexión de dispositivo. Introduce las propiedades del dispositivo tal como se muestra en la imagen (no incluida en el texto original) para establecer una conexión de cliente MQTT al puerto 1883 (puerto estándar de MQTT).
4. Si la conexión es exitosa, aparecerá un círculo verde junto al dispositivo MQTT.

Paso 3: Añadir pines de salida

1. Una vez creada la conexión correctamente, haz clic en el botón "Edit device tags" junto al dispositivo QTT (este botón se encuentra junto al icono con forma de lápiz). Aquí añadirás los pines del PLC Raspberry Pi que desees usar. En este ejemplo, añadiremos los mismos que en el flujo de Node-RED para el RPIPLC_21 (de Q0.0 a Q0.7 y de I0.0 a I0.12).
2. Comienza añadiendo los pines de salida. Haz clic en el botón más (+) n la parte inferior derecha de la página para añadir la primera conexión. Ahora estarás en el menú "Broker Topics to subscribe and publish". Selecciona la opción "Publish" e introduce el nombre del tema (topic) y la ruta como "Q0.0_value". Haz clic en el botón "Publish" y luego en "Close" para cerrar la ventana.
3. A continuación, crea otra conexión, ve de nuevo a la opción "Publish" y asigna el nombre del tema como "Q0.0" y la ruta del tema como "Q/Q0.0". Haz clic en "Add attribute to payload" 3 veces, luego en el botón "JSON". En la columna "Key", introduce "zone", "index" y "value" en cada fila, respectivamente. En la columna "Type", asigna las dos primeras a "Static" y la tercera a "Tag". Para los valores, asigna "0" tanto a zone como a index (en este ejemplo, zone siempre será 0 para todos los pines), y para tag, selecciona el tema "Q0.0_value" previamente creado.
4. Repite este proceso para todos los pines de salida (Q0.0 a Q0.7). Una vez completado, deberías tener una configuración similar a la mostrada en la imagen del ejemplo (no incluida).

Paso 4: Añadir pines de entrada

1. Ahora añade los pines de entrada. Crea una nueva conexión y permanece en la opción "Subscribe". En la barra de búsqueda, escribe "I/#" y haz clic en la lupa para buscar. Esto debería listar todos los temas creados en el flujo de Node-RED.
2. Selecciona el tema "I/I0.0" y haz clic en el botón "JSON" para ver las direcciones disponibles. Desmarca los campos "index" y "zone" ya que no son necesarios en este proyecto. En la columna "Name" introduce "I0.0" (de lo contrario, el nombre por defecto será "I/I0.0[value]". Guarda la conexión haciendo clic en "Subscribe" y luego cierra la ventana con el botón "Close".
3. Repite este proceso para los demás pines de entrada. Una vez finalizado, la configuración debería parecerse a la del ejemplo mostrado en la imagen.

Configuración final del dispositivo

Puedes descargar toda esta configuración, incluyendo el dispositivo y las conexiones de etiquetas (tags), descargando el siguiente archivo:

Device settings json

Para importar esta configuración, ve a la página "Device settings" haz clic en el menú kebab (los tres puntos) y selecciona "Import devices".

Creación del panel (dashboard)

Ahora que hemos completado la configuración anterior, podemos crear y añadir todos los elementos necesarios al panel para visualizar e interactuar con los pines de nuestro PLC Raspberry Pi.

Paso 1: Configurar Vistas

1. Primero, navega a la página del editor yendo a "<http://ip_raspberry_pi_plc:1881/editor", o accede a la sección "Views" desde el menú "Setup".
2. Una vez allí, tienes dos opciones: usar la vista por defecto o crear una nueva. Para crear una nueva, haz clic en el botón más (+) en el menú desplegable "Views", introduce un nombre para la vista y haz clic en OK para guardarla.





3. Una vez creada o seleccionada la vista, haz clic en el menú kebab (tres puntos) para acceder a sus propiedades. Aquí puedes ajustar las dimensiones cambiando el ancho y la altura manualmente o seleccionando tamaños predefinidos. También puedes cambiar el color de fondo del blanco por otro.





4. En el menú "Setup", ve a "Layout" dentro de la categoría "User Interface". Si tienes múltiples vistas, puedes seleccionar cuál será la vista por defecto (la primera que se muestra al entrar en la página). También puedes configurar si mostrar el menú de navegación o exigir inicio de sesión al comenzar.

Paso 2: Añadir salidas digitales

1. Para comenzar a añadir elementos a la interfaz, primero añade títulos como "Outputs" y "Inputs" usando la herramienta "Text Tool".

 



2. Luego, añade interruptores (switches). Haz clic en un interruptor y abre el menú "Property" que aparece en la parte izquierda.





3. Personaliza el interruptor con los colores, valores y texto que desees.
4. En el campo "Tag" selecciona el dispositivo MQTT y elige la etiqueta "Q0.0_value" para asignar este interruptor a dicha etiqueta.
5. Copia el interruptor y ajusta la etiqueta para las otras salidas. Usa la herramienta de texto "Text Tool" para etiquetar cada interruptor con el pin correspondiente (por ejemplo, Q0.0, Q0.1) para identificar fácilmente a qué pin controla cada interruptor.
6. Guarda el proyecto usando el botón "Save" en la esquina superior izquierda. Ahora, ve a la página principal en "<http://ip_raspberry_pi_plc:1881" y prueba si los interruptores funcionan

Paso 3: Añadir entradas digitales

1. Para mostrar los valores de entrada digital, utiliza una tabla. Primero, añade una tabla con el botón "Table".





2. Haz clic en la tabla y luego en el botón "Property". Personaliza los colores y el tamaño de la fuente a tu gusto antes de agregar las entradas.





3. Abre el "Table customizer" haciendo clic en el botón con forma de lápiz.
4. Cambia el nombre y el tipo de cada columna con el menú kebab (tres puntos) de cada columna. Establece el primer nombre de columna como "Pin" y el segundo como "Value". Asigna el tipo de ambas columnas como "Label".
5. Añade una fila por cada pin de entrada digital usando el botón más (+) en la parte inferior izquierda de la ventana.
6. Escribe el nombre del pin (por ejemplo, I0.0, I0.1) en la columna izquierda. En la columna derecha, cambia el tipo de fila a "Variable" y asigna la etiqueta (tag) correspondiente a cada entrada.
7. Guarda los cambios haciendo clic en OK, y luego guarda el proyecto. Ahora puedes probar los pines de entrada en la página principal.

Paso 4: Mostrar entradas analógicas

Las entradas analógicas se pueden mostrar usando diferentes tipos de visualizaciones. Dado que las entradas analógicas pueden tener un rango de valores (no solo 0 o 1), exploraremos opciones más visuales.

1. Indicador circular (Circular Gauge):

1. Añade un indicador circular.





2. Haz clic en "Property" para configurarlo. Selecciona la etiqueta de la entrada que quieres mostrar.
3. Elige uno de los tres diseños disponibles y personalízalo. Ajusta el valor mínimo a 0 y el máximo a 4096, que representan el rango posible (donde 4096 equivale a 10 V).
4. Guarda el proyecto y verifica su correcto funcionamiento. Por ejemplo, si conectas una fuente de 10 V, el indicador estará completamente lleno; con 5 V, a la mitad; con 3,3 V, a un tercio.

2. Gráfico de línea (Line Chart):

1. Para rastrear la evolución de los cambios en la entrada analógica, añade un gráfico de línea. Primero, configura los ajustes del gráfico de línea yendo al menú "Setup" y seleccionando "Line Charts".
2. Añade una nueva configuración con el botón más (+) y asígnale un nombre. Abre sus opciones haciendo clic en el menú kebab y elige "Add Line" para asignar la etiqueta correspondiente a la entrada. Personaliza el color y otros ajustes si lo deseas.
3. Añade el gráfico de línea al panel usando el botón "Chart".





4. Asígnalo a la configuración que acabas de crear desde el menú "Property". Oculta la leyenda u otros ajustes si lo consideras necesario.
5. Guarda el proyecto y comprueba en la página principal si el gráfico funciona correctamente.

3. Gráfico de barras (Bar Graph):

1. Añadiremos todas las salidas analógicas en el mismo gráfico. Existen diferentes opciones, pero en este caso usaremos un gráfico de barras.
   
2. El procedimiento es similar al del gráfico de línea. Crea una nueva configuración de gráfico haciendo clic en el botón más (+). Luego, con el menú kebab, añade las etiquetas de las entradas analógicas. Personaliza colores y otras opciones a tu gusto, luego guarda la configuración.
3. Añade el gráfico de barras al panel usando el botón "Bar Graph".





4. En el menú "Property", selecciona la configuración del gráfico que acabas de crear en "Graph to show". Personaliza colores u otras opciones según tus preferencias, y guarda la configuración.
5. Guarda el proyecto y comprueba en la página principal si el gráfico funciona correctamente.

Uso de Scripts para automatizar las salidas

Podemos crear un script y asociarlo a un botón o imagen para automatizar acciones. Por ejemplo, puedes tener una imagen que, al hacer clic, apague todas las salidas.

1. Primero, navega a la página "Scripts" desde el menú "Setup".
2. Haz clic en el botón más (+) en la esquina inferior derecha de la página para añadir un nuevo script. Luego, abre el menú kebab (tres puntos) y selecciona "Edit Script Name". Nombra la función principal del script, por ejemplo "resetOutputs()", para identificarla fácilmente si creas múltiples scripts.





3. A continuación, haz clic en el less-than sign ("<") en la esquina superior derecha de la ventana. Esto abrirá un menú desplegable. Desde la lista de System Functions, selecciona "$setTag(TagID, value)". Deberás seleccionar la etiqueta de la salida que quieres modificar.





4. Tras seleccionar la etiqueta, asigna su valor a 0 (para apagar la salida). Repite este paso para todas las etiquetas de salida que quieras modificar. Para una mejor organización del código, coloca estos comandos dentro de una función y llámala después, lo que será útil si tu script crece en complejidad.
5. Añade la imagen que desees con el botón "Image Tool (embedded)" y ajusta su tamaño según sea necesario.





6. Haz clic en la imagen y luego en el botón Property. Navega a la segunda pestaña, Events, y añade un nuevo evento asociado a esta imagen. Establece el tipo de evento en "click", la acción en "Run Script" y elige el script que acabas de crear "resetOutputs()".

Resultado final

Después de seguir estos pasos, tendrás una interfaz completamente funcional en FUXA, capaz de interactuar con tu PLC Raspberry Pi. Prueba tanto las entradas como las salidas para asegurarte de que todo funciona como está previsto.

Con esta configuración, ahora dispones de una solución front-end robusta que integra Node-RED y FUXA, proporcionando un sistema de control altamente personalizable e interactivo para tu PLC Raspberry Pi.

Puedes descargar el proyecto completo de FUXA, incluyendo todas las configuraciones de dispositivos y etiquetas, scripts y el diseño de la interfaz, descargando el siguiente archivo JSON e importándolo usando el botón "Save" en la esquina superior izquierda de la página:

FUXA project json