Ejemplo de panel de control Node-RED con PLC basado en Raspberry Pi

¿Te gustaría sacar el máximo partido a Node-RED creando un completo panel de control de Node-RED?

Sigue este tutorial de Node-RED y añade todos los nodos del Dashboard a tu interfaz de usuario de Node-RED.

Instalación

En primer lugar, vamos a instalar el node-red-dashboard nodes. 

Una vez en Node-RED, comprueba que tienes conexión a Internet, y luego ve al menú de Node-RED > Gestionar Paleta > Instalar > Y escribe: node-red-dashboard.

Nodes

Una vez instalados, estos son los nodos que aparecerán en tu sección de nodos, con los que trabajaremos.

Añadir un nodo de botón al flujo

Ahora, vamos a probar estos nodos para establecer una primera configuración, para que puedas empezar a jugar desde este punto.

1. Arrastra el nodo botón y suéltalo en el flujo.

2. Haz doble clic en el nodo del botón para hacer la configuración. Para añadir un nuevo grupo de ui, únicamente tienes que hacer clic en el lápiz, cambiar la pestaña y el nombre si quieres, y hacer clic en Add (añadir).

3. Establece un tamaño para el widget para que se muestre en el tablero del nodo-rojo. Por ejemplo: 3x1. Si por defecto se establece como automático, no podrás cambiarlo en el diseño. Si estableces un tamaño ahora, podrás cambiarlo más adelante.

4. Añade una etiqueta para mostrar en tu panel de control de la interfaz de usuario. Por ejemplo: ON.

5. Y una de las cosas más importantes en este nodo es lo que quieres enviar, así que, en la opción: 

Establece el tipo y la carga útil que quieres enviar, una vez que se hace clic en el nodo del botón.

En este caso, vamos a establecer el tipo de carga útil: número. Y vamos a establecer la carga útil en 1.

Así, cuando hagamos clic en el nodo del botón en el tablero de la UI de Node-RED, estaremos enviando un número 1.                                                                                                                                                                                                                    

6. Haz clic en Done.

7. Deploy (desplegar).

8. Haz lo mismo añadiendo un botón OFF, con todos los parámetros a 0.

Conectar un nodo de calibre a los botones

Para que los valores del botón sean útiles, vamos a añadir un nodo indicador que los muestre.

1. Arrastra el nodo del medidor y suéltalo en el flujo. Conéctalo a los nodos de los botones.

2. Haz doble clic para cambiar los parámetros.

3. Añade un tamaño: como 6x4.

4. Cambia el tipo a Donut. 

5. Establece una etiqueta.

6. Establece un rango. En nuestro caso es: min: 0 max: 1

7. Por último, establece un gradiente de color o déjalo por defecto.

8. Haz clic en Done.

9. Deploy (despliega).

Establecer el diseño de un widget

Ve al menú de la derecha > Dashboard (Panel de control) > Layout (Diseño) > Pasa el ratón por encima de tu pestaña. En nuestro caso: Home (Inicio) > Layout (Diseño). Y en el editor de diseño, establece un ancho en función del tamaño de tu pantalla, y muestra los widgets como quieras.

Ve al menú de tu Node-RED, ve a Importar, pega este JSON de abajo, ¡e importa nuestro pequeño programa para compararlo con el tuyo!

[{"id":"df93bc2e.84af5","type":"tab","label":"Industrial Shields","disabled":false,"info":""},{"id":"370cc075.95e99","type":"ui_tab","name":"Home","icon":"dashboard","disabled":false,"hidden":false},{"id":"9b345c1a.1d50e","type":"ui_base","theme":{"name":"theme-dark","lightTheme":{"default":"#0094CE","baseColor":"#0094CE","baseFont":"-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif","edited":true,"reset":false},"darkTheme":{"default":"#097479","baseColor":"#097479","baseFont":"-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif","edited":true,"reset":false},"customTheme":{"name":"Untitled Theme 1","default":"#4B7930","baseColor":"#4B7930","baseFont":"-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif"},"themeState":{"base-color":{"default":"#097479","value":"#097479","edited":false},"page-titlebar-backgroundColor":{"value":"#097479","edited":false},"page-backgroundColor":{"value":"#111111","edited":false},"page-sidebar-backgroundColor":{"value":"#333333","edited":false},"group-textColor":{"value":"#0eb8c0","edited":false},"group-borderColor":{"value":"#555555","edited":false},"group-backgroundColor":{"value":"#333333","edited":false},"widget-textColor":{"value":"#eeeeee","edited":false},"widget-backgroundColor":{"value":"#097479","edited":false},"widget-borderColor":{"value":"#333333","edited":false},"base-font":{"value":"-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif"}},"angularTheme":{"primary":"indigo","accents":"blue","warn":"red","background":"grey","palette":"light"}},"site":{"name":"Node-RED Dashboard","hideToolbar":"false","allowSwipe":"false","lockMenu":"false","allowTempTheme":"true","dateFormat":"DD/MM/YYYY","sizes":{"sx":48,"sy":48,"gx":6,"gy":6,"cx":6,"cy":6,"px":0,"py":0}}},{"id":"e0bb0cc5.a214f","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":1,"width":1,"height":1},{"id":"8d78289a.07f5f8","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":3,"width":17,"height":1},{"id":"f8c8af2a.1eb2b","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":4,"width":1,"height":1},{"id":"c0efb76a.fd24b8","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":5,"width":17,"height":1},{"id":"d8d15dc2.13e1e","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":6,"width":1,"height":1},{"id":"d7805eb1.a8f4e","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":7,"width":17,"height":1},{"id":"e3f78709.1c14f8","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":8,"width":1,"height":1},{"id":"9ae0e15d.9364e","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":9,"width":17,"height":1},{"id":"65e51c3a.7ea864","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":10,"width":1,"height":1},{"id":"be4a7a82.e1a678","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":12,"width":1,"height":1},{"id":"e121ea75.3ca078","type":"ui_spacer","name":"spacer","group":"9d731610.1cf498","order":14,"width":17,"height":1},{"id":"a5d3c52e.1b2358","type":"ui_group","name":"Default1","tab":"370cc075.95e99","order":1,"disp":true,"width":"25","collapse":false},{"id":"268c9638.c41dda","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":2,"width":1,"height":1},{"id":"5c821141.8305b","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":4,"width":2,"height":1},{"id":"d9ebb747.f02e88","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":6,"width":3,"height":1},{"id":"63343dcd.587e54","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":7,"width":1,"height":1},{"id":"2606fb3a.8c5284","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":8,"width":2,"height":1},{"id":"bd79d7f0.d8ed48","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":9,"width":3,"height":1},{"id":"d98b1286.0f5ca","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":10,"width":1,"height":1},{"id":"b9c39bba.a91568","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":11,"width":2,"height":1},{"id":"5be65878.01dc28","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":12,"width":3,"height":1},{"id":"c35dc643.2d8b48","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":13,"width":1,"height":1},{"id":"2639e97d.de3c56","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":14,"width":2,"height":1},{"id":"ed26ce10.98005","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":17,"width":3,"height":1},{"id":"333105f1.295d4a","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":20,"width":1,"height":1},{"id":"54f0e916.79aaf8","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":21,"width":11,"height":1},{"id":"1b170cfa.9290c3","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":22,"width":16,"height":1},{"id":"a9d23bcc.c22168","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":25,"width":3,"height":1},{"id":"8e5d9c79.a3866","type":"ui_spacer","name":"spacer","group":"a5d3c52e.1b2358","order":27,"width":19,"height":1},{"id":"4d378d6f.b169c4","type":"ui_button","z":"df93bc2e.84af5","name":"","group":"a5d3c52e.1b2358","order":18,"width":3,"height":1,"passthru":false,"label":"ON","tooltip":"It sends a number 1","color":"white","bgcolor":"#2E9348","icon":"","payload":"1","payloadType":"num","topic":"topic","topicType":"msg","x":390,"y":60,"wires":[["cdc300a7.c174"]]},{"id":"cdc300a7.c174","type":"ui_gauge","z":"df93bc2e.84af5","name":"","group":"a5d3c52e.1b2358","order":1,"width":6,"height":4,"gtype":"donut","title":"MyLabel","label":"","format":"{{value}}","min":0,"max":"1","colors":["#ff0000","#e6e600","#2e9348"],"seg1":"","seg2":"","x":640,"y":100,"wires":[]},{"id":"584cf30b.9c66cc","type":"ui_button","z":"df93bc2e.84af5","name":"","group":"a5d3c52e.1b2358","order":19,"width":3,"height":1,"passthru":false,"label":"OFF","tooltip":"It sends a number 0","color":"white","bgcolor":"red","icon":"","payload":"0","payloadType":"num","topic":"topic","topicType":"msg","x":390,"y":100,"wires":[["cdc300a7.c174"]]},{"id":"ca9fd8d6.2d71c8","type":"ui_slider","z":"df93bc2e.84af5","name":"","label":"Slider","tooltip":"","group":"a5d3c52e.1b2358","order":15,"width":5,"height":1,"passthru":true,"outs":"all","topic":"topic","topicType":"msg","min":0,"max":10,"step":1,"x":390,"y":280,"wires":[["113afc57.3c75f4","1808a023.bca5d","c61f7280.bd066"]]},{"id":"20cfff70.02bca","type":"ui_switch","z":"df93bc2e.84af5","name":"","label":"Switch","tooltip":"","group":"a5d3c52e.1b2358","order":23,"width":3,"height":1,"passthru":true,"decouple":"false","topic":"topic","topicType":"msg","style":"","onvalue":"10","onvalueType":"num","onicon":"","oncolor":"","offvalue":"0","offvalueType":"num","officon":"","offcolor":"","animate":false,"x":390,"y":200,"wires":[["113afc57.3c75f4","1808a023.bca5d","ca9fd8d6.2d71c8"]]},{"id":"5197479b.43d4a8","type":"ui_chart","z":"df93bc2e.84af5","name":"","group":"a5d3c52e.1b2358","order":3,"width":7,"height":5,"label":"MyChart","chartType":"line","legend":"false","xformat":"HH:mm:ss","interpolate":"linear","nodata":"","dot":true,"ymin":"0","ymax":"10","removeOlder":"1","removeOlderPoints":"","removeOlderUnit":"3600","cutout":0,"useOneColor":false,"useUTC":false,"colors":["#1f77b4","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"outputs":1,"useDifferentColor":false,"x":640,"y":360,"wires":[[]]},{"id":"d6cf5408.f71e58","type":"random","z":"df93bc2e.84af5","name":"","low":1,"high":10,"inte":"true","property":"payload","x":400,"y":360,"wires":[["5197479b.43d4a8"]]},{"id":"1c3fefd4.c7fa7","type":"inject","z":"df93bc2e.84af5","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"1","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":150,"y":360,"wires":[["d6cf5408.f71e58"]]},{"id":"4d843376.8b075c","type":"ui_dropdown","z":"df93bc2e.84af5","name":"","label":"","tooltip":"","place":"Select option","group":"a5d3c52e.1b2358","order":26,"width":6,"height":1,"passthru":true,"multiple":false,"options":[{"label":"Connected","value":1,"type":"num"},{"label":"Not connected","value":0,"type":"num"}],"payload":"","topic":"topic","topicType":"msg","x":400,"y":140,"wires":[["cdc300a7.c174"]]},{"id":"113afc57.3c75f4","type":"ui_gauge","z":"df93bc2e.84af5","name":"","group":"a5d3c52e.1b2358","order":5,"width":6,"height":3,"gtype":"wave","title":"MyGauge","label":"","format":"{{value}}","min":0,"max":10,"colors":["#00b500","#e6e600","#ca3838"],"seg1":"","seg2":"","x":640,"y":200,"wires":[]},{"id":"1808a023.bca5d","type":"ui_text","z":"df93bc2e.84af5","group":"a5d3c52e.1b2358","order":16,"width":1,"height":1,"name":"","label":"","format":"{{msg.payload}}","layout":"row-center","x":630,"y":280,"wires":[]},{"id":"c61f7280.bd066","type":"ui_numeric","z":"df93bc2e.84af5","name":"","label":"","tooltip":"","group":"a5d3c52e.1b2358","order":24,"width":3,"height":1,"wrap":false,"passthru":true,"topic":"topic","topicType":"msg","format":"{{value}}","min":0,"max":10,"step":1,"x":140,"y":280,"wires":[["ca9fd8d6.2d71c8"]]}]