场景
Node-RED中使用json节点解析JSON数据:
https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/124188611
在上面的基础上怎样解析json数据显示天气资料仪表盘。
https://lbs.amap.com/api/webservice/guide/api/weatherinfo#weatherinfo
注册并申请自己的key,可以先在浏览器中访问数据。
注:
博客:
https://blog.csdn.net/badao_liumang_qizhi
关注公众号
霸道的程序猿
获取编程相关电子书、教程推送与免费下载。
实现
1、拖拽一个http请求并编辑
2、编辑json解析组件,选择JSON字符串与对象互转
3、然后拖拽change组件并编辑
获取对应数据结构的天气描述
4、拖拽text组件用来显示天气描述
5、拖拽仪表盘组件并编辑,仪表盘参考如下
Node-RED安装图形化节点dashboard实现订阅mqtt主题并在仪表盘中显示温度:
https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/121992760
6、效果
7、Json数据
[ { "id": "f4a4d8eab7935bc8", "type": "tab", "label": "流程 3", "disabled": false, "info": "", "env": [] }, { "id": "c428312d1f6165d1", "type": "mqtt-broker", "name": "mqtt", "broker": "127.0.0.1", "port": "1883", "clientid": "", "autoConnect": true, "usetls": false, "protocolVersion": "4", "keepalive": "60", "cleansession": true, "birthTopic": "", "birthQos": "0", "birthPayload": "", "birthMsg": {}, "closetopic": "", "closeQos": "0", "closePayload": "", "closeMsg": {}, "willTopic": "", "willQos": "0", "willPayload": "", "willMsg": {}, "sessionExpiry": "" }, { "id": "51eee50b4ec9422f", "type": "ui_group", "name": "dashboardDemo", "tab": "29ae4c620f43ee0d", "order": 1, "disp": true, "width": "6", "collapse": false, "className": "" }, { "id": "29ae4c620f43ee0d", "type": "ui_tab", "name": "Home", "icon": "dashboard", "disabled": false, "hidden": false }, { "id": "a506c767a5c1edbd", "type": "ui_base", "theme": { "name": "theme-light", "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": 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": "#0094CE", "value": "#0094CE", "edited": false }, "page-titlebar-backgroundColor": { "value": "#0094CE", "edited": false }, "page-backgroundColor": { "value": "#fafafa", "edited": false }, "page-sidebar-backgroundColor": { "value": "#ffffff", "edited": false }, "group-textColor": { "value": "#1bbfff", "edited": false }, "group-borderColor": { "value": "#ffffff", "edited": false }, "group-backgroundColor": { "value": "#ffffff", "edited": false }, "widget-textColor": { "value": "#111111", "edited": false }, "widget-backgroundColor": { "value": "#0094ce", "edited": false }, "widget-borderColor": { "value": "#ffffff", "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": "248cbbb0.18e794", "type": "ui_group", "name": "MyGroup", "tab": "3f79c420.cfc1bc", "order": 1, "disp": true, "width": "6", "collapse": false }, { "id": "3f79c420.cfc1bc", "type": "ui_tab", "name": "Home", "icon": "dashboard", "disabled": false, "hidden": false }, { "id": "a0954be5.a7f7e8", "type": "ui_group", "name": "MyInput", "tab": "3f79c420.cfc1bc", "order": 2, "disp": true, "width": "6", "collapse": false }, { "id": "508bd6f8398ab80f", "type": "ui_group", "name": "OpenWeatherMap", "tab": "3f79c420.cfc1bc", "order": 3, "disp": true, "width": "6", "collapse": false }, { "id": "3a119cb540f23194", "type": "http request", "z": "f4a4d8eab7935bc8", "name": "", "method": "GET", "ret": "txt", "paytoqs": "ignore", "url": "https://restapi.amap.com/v3/weather/weatherInfo?city=370200&key=你自己申请的key", "tls": "", "persist": false, "proxy": "", "authType": "", "senderr": false, "x": 320, "y": 200, "wires": [ [ "955652a1f601d333" ] ] }, { "id": "4a1f7982bbb68198", "type": "inject", "z": "f4a4d8eab7935bc8", "name": "", "props": [ { "p": "payload" }, { "p": "topic", "vt": "str" } ], "repeat": "300", "crontab": "", "once": false, "onceDelay": "", "topic": "", "payload": "", "payloadType": "date", "x": 180, "y": 200, "wires": [ [ "3a119cb540f23194" ] ] }, { "id": "955652a1f601d333", "type": "json", "z": "f4a4d8eab7935bc8", "name": "", "property": "payload", "action": "", "pretty": false, "x": 450, "y": 200, "wires": [ [ "8ba9a66cc1efa19a", "a387539f2dbf1dcc" ] ] }, { "id": "8ba9a66cc1efa19a", "type": "change", "z": "f4a4d8eab7935bc8", "name": "Set Description", "rules": [ { "t": "set", "p": "payload", "pt": "msg", "to": "payload.lives[0].weather", "tot": "msg" } ], "action": "", "property": "", "from": "", "to": "", "reg": false, "x": 620, "y": 200, "wires": [ [ "4e8cf314d127cbcf" ] ] }, { "id": "4e8cf314d127cbcf", "type": "ui_text", "z": "f4a4d8eab7935bc8", "group": "508bd6f8398ab80f", "order": 3, "width": 0, "height": 0, "name": "", "label": "天氣描述: ", "format": "{{msg.payload}}", "layout": "row-spread", "className": "", "x": 780, "y": 200, "wires": [] }, { "id": "a387539f2dbf1dcc", "type": "change", "z": "f4a4d8eab7935bc8", "name": "Set Temp", "rules": [ { "t": "set", "p": "payload", "pt": "msg", "to": "payload.lives[0].temperature", "tot": "msg" } ], "action": "", "property": "", "from": "", "to": "", "reg": false, "x": 600, "y": 260, "wires": [ [ "2b38a29dfeaed3e4" ] ] }, { "id": "2b38a29dfeaed3e4", "type": "ui_gauge", "z": "f4a4d8eab7935bc8", "name": "", "group": "508bd6f8398ab80f", "order": 4, "width": 0, "height": 0, "gtype": "gage", "title": "溫度: ", "label": "units", "format": "{{value}}", "min": 0, "max": "50", "colors": [ "#00b500", "#e6e600", "#ca3838" ], "seg1": "", "seg2": "", "className": "", "x": 770, "y": 260, "wires": [] } ]
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。