iNeuOS工业互联网，Web组态增加三维（3D）模型渲染、标注、巡检、预警功能
iNeuOS工业互联网，Web组态增加三维（3D）模型渲染、标注、巡检、预警功能
目 录
1..... 概述... 2
2..... 适用场景... 2
3..... 视图建模（Web 组态）功能特点... 3
3.1 编辑器与工作流... 3
3.2 资源库（四类可拖拽资源）... 3
3.3 双渲染内核与图层能力（技术亮点）... 3
3.4 数据接入... 4
3.5 交互与联动... 4
3.6 报警与动效... 4
3.7 画布/容器配置... 4
3.8 编辑效率... 5
4..... 3D 渲染功能特点... 5
4.1 模型接入... 5
4.2 场景交互... 6
4.3 模型变换... 6
4.4 3D模型部件标注（绑定数据点）... 6
4.5 部件巡检（自动巡游）... 7
4.6 实时预警... 8
4.7 实现效果... 8
5..... 2D 与 3D 的融合特性... 8
1. 概述
iNeuOS工业互联网的视图建模（Web 组态）：浏览器端可视化画面编辑器，用"拖拽组态 + 属性配置 + 数据绑定"的方式，把工业现场数据、设备状态、工艺流程等组装成监控画面，并一键发布到监控页/预览窗/分享链接。
3D 渲染：作为组态体系中的一类"元件"，支持接入真实三维模型（设备/产线/站房），并叠加部件级标注、巡检巡游、实时预警三类业务能力，实现"2D 画面 + 3D 数字孪生"的混合组态。
技术底座：前端 Vue3 +（2D 内核+ 3D 内核），数据侧与平台实时数采、编辑器与运行端同一套渲染内核，"所见即所得"，发布后画面与编辑时一致。编辑界面，如下图
2. 适用场景
工业监控大屏 / 中控室看板；设备状态可视化与故障预警；产线/站房数字孪生；工艺流程组态画面；领导驾驶舱与分享页面。
3. 视图建模（Web 组态）功能特点
3.1 编辑器与工作流
四大区域：顶部菜单（文件/编辑/选择/视图/帮助）、左侧资源与工具、中部画布、右侧属性面板。
保存体系：保存组态（按菜单树挂载、菜单即权限）、保存组件（把选中元件存为可复用组件）、导入/导出 .ineuview 工程文件。
运行端形态：编辑 → 预览（新窗口）→ 监控页 / 弹窗 / 分享链接，多端同一画面。
3.2 资源库（四类可拖拽资源）
|
资源 |
内容 |
|
素材 |
系统素材库有5600多个SVG图元（按目录管理、素材选择入库）+ 自定义素材（png/jpg/jpeg/gif/svg，单文件＜1M，批量上传） |
|
元件 |
标题、数据点、按钮、最新时间、视频、Iframe、3D 渲染 |
|
绘图 |
选择 / 画笔 / 箭头 / 直线 / 虚线 / 圆 / 椭圆 / 方形 / 直角 / 等边三角形（边框、填充、线宽可调） |
|
图表 |
折线图、时序柱状图、饼图、仪表图、进度图、液位图（支持实时 / 历史数据、预警值与预警线颜色） |
|
组件 |
用户自存的可复用组合件 |
3.3 双渲染内核与图层能力（技术亮点）
编辑器采用双渲染体系：普通元件（标题/数据点/按钮/绘图/素材/图表）绘制于 Canvas 内；视频/网页/3D 等富交互元件以 DOM 层叠加渲染。两套体系在置顶/置底、层级调整上做了统一抽象，可相互叠放。
图层操作：置顶层 / 置底层 / 置上一级 / 置下一级；上下左右对齐、水平/垂直居中、垂直/水平翻转；成组/解组。
3.4 数据接入
数据点绑定：从物联网数据点和业务数据点树中选点，支持小数位等显示格式；数据值实时刷新到画面。
容器级自定义接口：可为每个画布容器替换数据来源，按接口规范提供当前值 / 历史值 / 数据点三类接口地址，并以"刷新频率"轮询；默认走平台数据服务。
运行端数据链路：按容器统一收集画面全部数据点 → 周期性请求最新值 → 分发刷新所有绑定元件（同一轮请求、统一刷新节拍）。
3.5 交互与联动
单击事件三类：打开连接（自定义地址 / 监测页面，页内弹窗或新标签，宽高 px/% 可设）、远程控制指令（布尔值 / 固定值 / 自定义输入值）、请求接口（GET）。
视频元件：平台摄像机直播列表选择，或自定义源（rtmp / hls / websocket / mp4 / webm / ogv / m3u8）。
3.6 报警与动效
数据点报警规则可挂动画动作：变色、变色+闪烁、旋转、隐藏（引擎同时支持跳动、抖动、移动等动作类型），报警触发即执行、恢复即还原。支持自定义报警脚本扩展（函数式判定）。
3.7 画布/容器配置
画布模式：无限画布（自动扩展）或固定尺寸（网格显示、背景色、背景图）。
缩放：10%~500%，一键"缩放到内容 / 缩放到宽度 / 缩放到画布 / 重置缩放"。
运行方式开关：锁定缩放、锁定平移（控制运行端交互权限；运行端默认锁定平移，避免查看大屏时误拖动画）。
容器级刷新频率、接口地址均随组态保存和导出。
3.8 编辑效率
完整热键体系：Ctrl +/-/0 缩放、Ctrl+方向键移动、Ctrl+R 旋转、Del 删除、Ctrl+C 复制、Shift 保持比例/平行移动、Ctrl+G 组/解组、Ctrl+J/K 隐藏显示 Canvas、Ctrl+D/F 隐藏显示 Dom、置顶/置底层热键等（内置"热键参考"面板）。
元件树：树形列出画面全部元件（含 3D 部件树），支持搜索、点选定位。
4. 3D 渲染功能特点
4.1 模型接入
支持 .glb / .gltf / .fbx / .obj 四类主流格式，单文件 ≤ 100MB，面板内上传（带进度）。
模型加载后自动归一化与取景：统一尺度、居中、自动适配视口，不同来源的模型（导出比例不一）即传即用。导出模型，如下图：
4.2 场景交互
视角操作：左键旋转 / 滚轮缩放 / 右键平移。
部件点选：射线拾取选中模型任意部件，高亮显示并在属性面板展示部件名称与层级路径；支持聚焦部件（一键缩放到该部件）。
编辑态：双击画布上的 3D 元件进入"3D 编辑模式"，顶部工具条切换移动 / 旋转 / 缩放手柄，可选显隐控件，完成后退出。
4.3 模型变换
位置偏移（X/Y/Z）、旋转（X/Y/Z，度）、等比缩放精确输入，作为增量叠加在归一化取景位姿之上，随元件配置自动保存/导出；一键"恢复原始位置与视角"。
4.4 3D模型部件标注（绑定数据点）
每个部件可添加标注：自定义文字/数字 或 绑定数据点（实时显示"名称：数值"，数字保留两位小数）。
样式可配：字体、字号、背景色；标注标签 + 引导线（线连部件顶部）方式呈现，随模型旋转实时跟随。选择3D模型部件：
部件标注、巡检和预警，如下图：
4.5 部件巡检（自动巡游）
把部件"加入巡检"形成巡游路径（按加入顺序依次飞行），每个部件可设停留时长与飞行速度；全局可设巡检启用开关、巡检周期（分钟）。
运行时相机自动沿部件飞行，适合值班大屏自动浏览设备。
4.6 实时预警
部件预警绑定其标注数据点的实时值：数据点值传入预警判定脚本，返回预警状态时该部件以预警颜色高亮，恢复后自动还原。
脚本支持"脚本校验"（语法 + 函数存在 + 中值试运行）。
高亮优先级：预警高亮 > 选中高亮，互不污染；引擎采用材质克隆 + 自发光叠加层实现，不改动模型原材质，多级高亮可叠加/逐层清除。
4.7 实现效果
5. 2D 与 3D 的融合特性
3D 元件就是画布上的普通元件：可拖拽、缩放、旋转、锁定、参与层级（置顶/置底）与元素树管理。
在同一画面里，2D 图表/数据点/按钮与 3D 场景共享同一数据源、同一交互体系、同一套报警逻辑。
典型用法：3D 设备场景作底图 + 2D 仪表/曲线/按钮叠加；或 3D 侧站房 + 部件标注实时数据 + 部件级预警闪烁。
参考文章
（1）硬件网关：https://mp.weixin.qq.com/s/iKMqn62YIhBlXjGtY2wKXQ。
（2）物联网（IOT）：https://mp.weixin.qq.com/s/5u4L8fItaFpIbVYOlxbmGg。
（3）视觉分析（Vision）：https://mp.weixin.qq.com/s/SiiuXTTGplTAERRYyCmGCQ。
（4）大模型智库（AiMind）：https://mp.weixin.qq.com/s/SH_q2k_zbQ-pcd05zj86-g。
（5）大模型智能问数（AiInsight）: https://mp.weixin.qq.com/s/A1fIQq_w9c8SW9aEWVIsgw。
（6）小i助手：https://mp.weixin.qq.com/s/5UCoYsDAbfFP-ZI2sj_QBg。
（7）视觉模型：https://mp.weixin.qq.com/s/Gq74ITDfEwK88jt8b--1PA。
物联网&大数据技术 QQ群：54256083
物联网&大数据项目 QQ群：727664080
QQ：504547114
浙公网安备 33010602011771号