首页 > 编程语言 >Node-RED中使用node-red-contrib-image-output节点实现图片预览

Node-RED中使用node-red-contrib-image-output节点实现图片预览

时间:2023-03-22 12:32:40浏览次数:47  
标签:Node node false name edited image value type id


场景

Node-RED简介与Windows上安装、启动和运行示例:

Node-RED简介与Windows上安装、启动和运行示例_霸道流氓气质的博客_nodered windows

Node-RED怎样导出导入流程为json文件:

Node-RED怎样导出导入流程为json文件_霸道流氓气质的博客-_怎么导出json文件

在上面的基础上怎样在流程面板中就可以对照片进行预览。

可以安装node-red-contril-image-out节点。

注:

博客:​​霸道流氓气质的博客_C#,架构之路,SpringBoot领域博主​​

关注公众号
霸道的程序猿
获取编程相关电子书、教程推送与免费下载。

实现

1、节点管理,搜索并安装

Node-RED中使用node-red-contrib-image-output节点实现图片预览_Ubuntu

2、通过read file节点读取文件,文件名是图片全路径

Node-RED中使用node-red-contrib-image-output节点实现图片预览_bc_02

3、拖拽并编辑image节点

Node-RED中使用node-red-contrib-image-output节点实现图片预览_UI_03

4、全流程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": "8824dea1.83e31",
"type": "websocket-client",
"path": "ws://localhost:9898/",
"tls": "",
"wholemsg": "false"
},
{
"id": "51c3503.61936b",
"type": "MySQLdatabase",
"name": "",
"host": "127.0.0.1",
"port": "3306",
"db": "test",
"tz": "",
"charset": "UTF8"
},
{
"id": "8ebfda5.eff8628",
"type": "file in",
"z": "f4a4d8eab7935bc8",
"name": "",
"filename": "D:\\badao.png",
"format": "",
"chunk": false,
"sendError": false,
"encoding": "none",
"allProps": false,
"x": 420,
"y": 160,
"wires": [
[
"96811d4b.09333"
]
]
},
{
"id": "96811d4b.09333",
"type": "image",
"z": "f4a4d8eab7935bc8",
"name": "",
"width": 160,
"data": "payload",
"dataType": "msg",
"thumbnail": false,
"active": true,
"pass": false,
"outputs": 0,
"x": 640,
"y": 160,
"wires": []
},
{
"id": "298991fc.92724e",
"type": "inject",
"z": "f4a4d8eab7935bc8",
"name": "",
"props": [
{
"p": "payload"
},
{
"p": "topic",
"vt": "str"
}
],
"repeat": "",
"crontab": "",
"once": false,
"onceDelay": 0.1,
"topic": "",
"payload": "",
"payloadType": "date",
"x": 260,
"y": 160,
"wires": [
[
"8ebfda5.eff8628"
]
]
}
]

标签:Node,node,false,name,edited,image,value,type,id
From: https://blog.51cto.com/BADAOLIUMANGQZ/6142405

相关文章