Changes for page Node-RED_Install and Use
Last modified by Herong Lu on 2024/03/05 08:37
Summary
-
Page properties (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -78,10 +78,12 @@ 78 78 79 79 Take NBSN95 mod1 UDP protocol as an example 80 80 81 -After logging into the interface click '+'to create a flow81 +After logging into the interface click** (% style="color:red" %)"+" (%%)**to create a flow 82 82 83 83 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519133634-1.png?rev=1.1||alt="image-20220519133634-1.png" height="231" width="972"]] 84 84 85 + 86 + 85 85 Rename the stream 86 86 87 87 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519134042-2.png?rev=1.1||alt="image-20220519134042-2.png" height="552" width="565"]] ... ... @@ -92,33 +92,46 @@ 92 92 93 93 Drag UDP into the editing area 94 94 97 + 98 + 95 95 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519134533-5.png?rev=1.1||alt="image-20220519134533-5.png"]] 96 96 101 + 97 97 The same method as above, drag and drop functions and debug into the editing area 98 98 99 99 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519134850-6.png?rev=1.1||alt="image-20220519134850-6.png"]] 100 100 106 + 107 + 101 101 configure UDP in 102 102 103 103 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519135402-7.png?rev=1.1||alt="image-20220519135402-7.png"]] 104 104 112 + 105 105 Write to the UDP port that the device node sends to the server 106 106 107 107 Example My UDP device node sends to server port 8585 108 108 just write 8585 109 109 110 -Note that the port that is already in use cannot be used. If the receiving fails, you need to check whether the port of the server is occupied. The sending port of the device node should not use the default port used by the server, such as a common port such as 8080. 111 111 119 +(% style="color:red" %)**Note: that the port that is already in use cannot be used. If the receiving fails, you need to check whether the port of the server is occupied. The sending port of the device node should not use the default port used by the server, such as a common port such as 8080.** 120 + 121 + 112 112 In order to avoid data confusion, different types of nodes do not use the same UDP port, because different nodes have different data formats and different functions. 113 113 114 114 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519135915-8.png?rev=1.1||alt="image-20220519135915-8.png"]] 115 115 126 + 116 116 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519144651-14.png?rev=1.1||alt="image-20220519144651-14.png"]] 117 117 129 + 118 118 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519141355-11.png?rev=1.1||alt="image-20220519141355-11.png"]] 119 119 132 + 120 120 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519141704-12.png?rev=1.1||alt="image-20220519141704-12.png"]] 121 121 135 + 136 + 122 122 When the node successfully sends data, the effect shown in the following figure will appear 123 123 124 124 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519150455-15.png?rev=1.1||alt="image-20220519150455-15.png"]] ... ... @@ -131,6 +131,7 @@ 131 131 If you are familiar with JS code, you can write it yourself 132 132 If you are not familiar, we have the JS code for each type of node, you just need to copy and paste it into it 133 133 149 + 134 134 [[image:http://8.211.40.43:8080/xwiki/bin/download/Main/Node-RED/node_red%20usage%20example/WebHome/image-20220519141833-13.png?rev=1.1||alt="image-20220519141833-13.png"]] 135 135 136 136 ... ... @@ -143,12 +143,18 @@ 143 143 144 144 [[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"]] 145 145 146 -~1. Click Install 162 + 163 + 164 +(% style="color:blue" %)**1. Click Install 147 147 2. Search the dashboard 148 -3. Click Install 166 +3. Click Install** 149 149 168 + 169 + 150 150 [[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"]] 151 151 172 + 173 + 152 152 After the installation is successful, nodered will show the following node icon 153 153 154 154 [[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"]] ... ... @@ -164,14 +164,21 @@ 164 164 165 165 The demo uses 3 kinds. Voltage, temperature, humidity 166 166 189 + 167 167 [[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"]] 168 168 192 + 193 + 169 169 double click function 170 170 196 + 171 171 [[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"]] 172 172 199 + 200 + 173 173 Adjusted to 3, because we need to display 3 charts 174 174 203 + 175 175 [[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"]] 176 176 177 177 ... ... @@ -181,28 +181,42 @@ 181 181 182 182 Double-click while setting up the node as above 183 183 213 + 184 184 [[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"]] 185 185 216 + 186 186 [[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"]] 187 187 219 + 188 188 [[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"]] 189 189 222 + 190 190 [[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"]] 191 191 225 + 192 192 [[image:image-20220525185746-2.png]] 193 193 228 + 194 194 [[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"]] 195 195 231 + 232 + 196 196 After the display interface is defined for the first time, subsequent charts can directly select the display interface 197 197 198 -[[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"]] 199 199 236 +[[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"]] 237 + 238 + 239 + 200 200 [[image:image-20220525190106-3.png]] 201 201 242 + 243 + 202 202 Connect graph nodes to functions with lines 203 203 204 204 Click to deploy 205 205 248 + 206 206 [[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"]] 207 207 208 208 Enter the server public IP + port 1880/ui ... ... @@ -209,6 +209,8 @@ 209 209 210 210 example:[[http:~~/~~/xxx.xx.xx.xx:1880/ui>>url:http://119.91.62.30:1880/ui/#!/18?socketid=WY1MCE0RFEKHey8KAADj]] 211 211 255 + 256 + 212 212 [[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"]] 213 213 214 214 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.