在window 中安装 Node-Red

Windows中安装并运行Node-Red

在window 中安装 Node-Red

一、安装 Node.js

1、官网

https://nodejs.org/zh-cn

2、下载 Node.js

直接安装。

二、安装 Node-Red

1、官网文档

https://nodered.org/docs/getting-started/local#installing-with-npm

2、按照文档

在 cmd 中安装

npm install -g --unsafe-perm node-red

三、运行 Node-Red

1、运行

node-red

出现如下信息

6 Feb 15:43:08 - [info]

Welcome to Node-RED
===================

6 Feb 15:43:08 - [info] Node-RED version: v4.0.8
6 Feb 15:43:08 - [info] Node.js  version: v22.13.1
6 Feb 15:43:08 - [info] Windows_NT 10.0.19045 x64 LE
6 Feb 15:43:09 - [info] Loading palette nodes
6 Feb 15:43:10 - [info] Settings file  : C:\Users\77813\.node-red\settings.js
6 Feb 15:43:10 - [info] Context store  : 'default' [module=memory]
6 Feb 15:43:10 - [info] User directory : \Users\77813\.node-red
6 Feb 15:43:10 - [warn] Projects disabled : editorTheme.projects.enabled=false
6 Feb 15:43:10 - [info] Flows file     : \Users\77813\.node-red\flows.json
6 Feb 15:43:10 - [info] Server now running at http://127.0.0.1:1880/
6 Feb 15:43:10 - [warn]

---------------------------------------------------------------------
Your flow credentials file is encrypted using a system-generated key.

If the system-generated key is lost for any reason, your credentials
file will not be recoverable, you will have to delete it and re-enter
your credentials.

You should set your own key using the 'credentialSecret' option in
your settings file. Node-RED will then re-encrypt your credentials
file using your chosen key the next time you deploy a change.
---------------------------------------------------------------------

6 Feb 15:43:10 - [info] Starting flows
6 Feb 15:43:10 - [info] Started flows

2、在浏览器中登录

http://127.0.0.1:1880
### 使用 Node-RED Dashboard 的详细指南 #### 安装 Node-RED 和 Dashboard 插件 为了使用 Node-RED Dashboard,首先需要安装 Node-RED 平台以及 `node-red-dashboard` 插件。可以通过 npm 命令完成插件的安装: ```bash npm install node-red-dashboard ``` 此命令会自动下载并配置必要的依赖项[^1]。 #### 创建基本仪表盘页面 Node-RED 提供了一组专用节点来构建仪表盘界面。这些节点可以拖放到工作流中,并通过简单的属性设置实现功能定制。以下是几个核心组件及其用途说明: - **ui_group**: 定义一组控件共享的空间布局参数。 - **ui_chart_node**: 显示时间序列图表的数据可视化工具。 - **ui_button_node**: 添加按钮触发事件逻辑。 - **ui_text_node**: 展现静态或动态文本内容。 例如,在新建流程里放置一个输入框 (`inject`) 节点连接到 ui 文本输出节点上,则每当发送消息时都会更新前端界面上对应位置的文字展示效果[^3]。 #### 配置与发布应用 当设计好所有交互元素之后,还需要指定它们所属的具体 tab 页面名称以及其他样式选项。这一步骤通常是在右侧编辑器面板内的“UI”标签页下完成操作。 最后记得保存更改并将整个项目部署运行起来即可访问完整的 web 版控制中心画面啦! 对于希望进一步扩展功能性的开发者来说,也可以考虑利用 Three.js 等外部图形渲染引擎引入更加复杂的三维场景支持[^5]。 ```javascript // 示例代码片段:初始化 three.js 场景对象 import * as THREE from 'three'; const scene = new THREE.Scene(); const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); const renderer = new THREE.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); function animate() { requestAnimationFrame(animate); // 更新模型状态... render(); } function render(){ renderer.render(scene, camera); } animate(); ``` 以上就是关于如何运用 Node-Red Dashboards 构建个性化监控系统的初步介绍啦!如果想要深入学习更多高级特性的话不妨查阅官方文档或者参与社区讨论获取最新资讯哦~
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值