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

生活中,最使人疲惫的往往不是道路的遥远,而是心中的郁闷;最使人痛苦的往往不是生活的不幸,而是希望的破灭;最使人颓废的往往不是前途的坎坷,而是自信的丧失;最使人绝望的往往不是挫折的打击,而是心灵的死亡。所以我们要有自己的梦想,让梦想的星光指引着我们走出落漠,走出惆怅,带着我们走进自己的理想。

导读:本篇文章讲解 Node-RED中使用node-red-contrib-image-output节点实现图片预览,希望对大家有帮助,欢迎收藏,转发!站点地址:www.bmabk.com,来源:原文

场景

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

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

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

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

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

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

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

注:

博客:
霸道流氓气质的博客_CSDN博客-C#,架构之路,SpringBoot领域博主
关注公众号
霸道的程序猿
获取编程相关电子书、教程推送与免费下载。

实现

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

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

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

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

3、拖拽并编辑image节点

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

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"
            ]
        ]
    }
]

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/135982.html

(0)
飞熊的头像飞熊bm

相关推荐

发表回复

登录后才能评论
极客之音——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!