Changes for page Node-RED_Install and Use
Last modified by Mengting Qiu on 2024/11/29 10:15
Summary
-
Page properties (1 modified, 0 added, 0 removed)
-
Attachments (0 modified, 3 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -115,7 +115,74 @@ 115 115 116 116 == Plot Chart for sensors == 117 117 118 +If you need data visualization, please refer to the following 118 118 120 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519152802-16.png?rev=1.1||alt="image-20220519152802-16.png"]] 121 + 122 +~1. Click Install 123 +2. Search the dashboard 124 +3. Click Install 125 + 126 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519152956-17.png?rev=1.1||alt="image-20220519152956-17.png"]] 127 + 128 +After the installation is successful, nodered will show the following node icon 129 + 130 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519153335-19.png?rev=1.1||alt="image-20220519153335-19.png"]] 131 + 132 +=== the line chart as an example === 133 + 134 +Drag the line chart to the editing area 135 + 136 +Just drag and drop as many as you need, or you can copy 137 + 138 +The demo uses 3 kinds. Voltage, temperature, humidity 139 + 140 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519154521-20.png?rev=1.1||alt="image-20220519154521-20.png"]] 141 + 142 +double click function 143 + 144 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519154640-21.png?rev=1.1||alt="image-20220519154640-21.png"]] 145 + 146 +Adjusted to 3, because we need to display 3 charts 147 + 148 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519154812-22.png?rev=1.1||alt="image-20220519154812-22.png"]] 149 + 150 +=== the chart settings === 151 + 152 +Double-click while setting up the node as above 153 + 154 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519160314-23.png?rev=1.1||alt="image-20220519160314-23.png"]] 155 + 156 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519160412-24.png?rev=1.1||alt="image-20220519160412-24.png"]] 157 + 158 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519160759-27.png?rev=1.1||alt="image-20220519160759-27.png"]] 159 + 160 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519161326-30.png?rev=1.1||alt="image-20220519161326-30.png"]] 161 + 162 +[[image:image-20220525185746-2.png]] 163 + 164 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519161650-32.png?rev=1.1||alt="image-20220519161650-32.png"]] 165 + 166 +After the display interface is defined for the first time, subsequent charts can directly select the display interface 167 + 168 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519162039-34.png?rev=1.1||alt="image-20220519162039-34.png"]] 169 + 170 +[[image:image-20220525190106-3.png]] 171 + 172 +Connect graph nodes to functions with lines 173 + 174 +Click to deploy 175 + 176 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519162412-36.png?rev=1.1||alt="image-20220519162412-36.png"]] 177 + 178 +Enter the server public IP + port 1880/ui 179 + 180 +example：[[http:~~/~~/xxx.xx.xx.xx:1880/ui>>url:http://119.91.62.30:1880/ui/#!/18?socketid=WY1MCE0RFEKHey8KAADj]] 181 + 182 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519163141-37.png?rev=1.1||alt="image-20220519163141-37.png"]] 183 + 184 +At this point, the basic demonstration of nodered is completed. If you need to beautify the chart and various visualizations, you can go to the official documentation of nodered for further understanding. 185 + 119 119 == Store Value == 120 120 121 121 ... ... @@ -124,6 +124,18 @@ 124 124 125 125 = Input Flow = 126 126 194 +Directly import JSON files to generate flow 195 + 196 +Download the required JSON file through this link: 提供一个链接 197 + 198 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/Directly%20import%20JSON%20files%20to%20generate%20flow/WebHome/image-20220524175748-3.png?rev=1.1||alt="image-20220524175748-3.png"]] 199 + 200 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/Directly%20import%20JSON%20files%20to%20generate%20flow/WebHome/image-20220524175814-4.png?rev=1.1||alt="image-20220524175814-4.png"]] 201 + 202 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/Directly%20import%20JSON%20files%20to%20generate%20flow/WebHome/image-20220524175914-5.png?rev=1.1||alt="image-20220524175914-5.png"]] 203 + 204 +[[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/Directly%20import%20JSON%20files%20to%20generate%20flow/WebHome/image-20220524175935-6.png?rev=1.1||alt="image-20220524175935-6.png"]] 205 + 127 127 == MQTT == 128 128 129 129 == UDP ==
- image-20220525185630-1.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.Lu - Size
-
... ... @@ -1,0 +1,1 @@ 1 +30.1 KB - Content
- image-20220525185746-2.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.Lu - Size
-
... ... @@ -1,0 +1,1 @@ 1 +44.2 KB - Content
- image-20220525190106-3.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.Lu - Size
-
... ... @@ -1,0 +1,1 @@ 1 +43.8 KB - Content