自动化的自动化(1)--OPCUA2HTML5

现在的自动化工程师是令人沮丧的,他们努力地实现各个行业的自动化系统,自己却停留在敲键盘的手工劳作的阶段,该解放自己了。这就是"自动化实现自动化"的话题。

OPC 统一架构(简称 OPC UA)是现代工厂自动化中用于机器通信的标准化安全解决方案。跨平台标准基于OPC基金会的规范,现在得到了所有知名机器和系统制造商以及所有常见PLC制造商的支持,如西门子、博世力士乐、艾伦布拉德利、倍福等。

HTML5 是 Web 技术的当前标准,所有主要浏览器都支持它。HTML5 的一个重点是实现丰富的 Web 应用程序。这是浏览器中交互式 Web 应用程序的演示,这些应用程序在设计和交互方面与已建立的桌面应用程序一样强大。

还有什么比将这两个广泛使用的标准结合起来更自然的呢,例如构建一个平台,实现 OPC UA 到 HTML5 自动映射?成为一个类似web SCADA 系统人机界面的OPCUA 客户端。实现"自动化(系统)的自动化(构建)" 的目标。这是一个令人兴奋的话题,同时面临不小的挑战。

2023年是AI 大语言模型的元年,AIGC必将在工业领域得到广泛的应用,甚至改变工业自动化的某些传统。其中一个重要的应用将是信息模型的生成,转换。研究OPCUA 2 HTML5 技术有助于实现OPCUA 2 HMI 的自动化。

基本思路

在OPCUA 信息模型中增加少量的HMI 信息,实现OPCUA 信息模型自动转换成基于HTML5的web 应用。是Web SCADA 类似的系统完全依赖OPCUA 模型生成。节省了大量系统组态的工程设计工作。

OPCUA 信息模型

OPC UA 模型的主要元素

  1. 对象(Object)
  2. 变量(Variable)
  3. 方法(Method)
  4. 告警(Event&Alarm)
  5. 视图(views)

上面的元素已经在许多文章中介绍过了,这里不在重复,唯有视图介绍的比较少。

在OPCUA 模型中,它的作用是在一个大的地址空间中,限制可见节点和引用。在一个大的OPCUA 服务器中,信息模型是相当复杂的,有大量的节点和引用。 并不是所有的节点都是观察者感兴趣。不同的观察者对不同的一组节点感兴趣。

views 是一个节点类型,它的内部设置了文件夹对象,并通过Organizes 引用指向信息模型中的对象,变量或者方法。

另一方面,views 对OPCUA 信息模型进一步组织。客户端能够利用views 来构建HMI架构。

物理设备的信息模型

简单的自动化控制系统有下列几种:

单一设备系统

一台设备构成的系统。

多设备系统

由多台设备构成的系统

分层系统

由多台设备构成,系统被分为多个子系统。形成分层结构。比如一个传送机构中包含了多个电机和传感器。

单一设备系统的信息模型

单一设备系统模型包括:

  • 特征
  • 操作
  • 告警、事件
  • HMI 信息
特征

为了能够在HMI 中明显地显示设备重要的特征,我们将设备的特征分为两类:

外部特征

外部特征是在HMI 页面的突出位置显示的特征。显示的方式可以是仪表盘,数显面板。外部特征被称为状态。

内部特征

更多设备的内部内部属性。包括数据的历史趋势图。

操作

操控面板,对应OPCUA 的方法(Method)。操作页面分为:

  • 按键面板
  • HTML5 已有大量的Button组件。
  • packML面板
  • PackML 最初是为包装行业制定的标准,但是目前已经远远地超出了PackML 的范畴,它俨然成为机器控制的通用接口标准。
  • 2020年11月11日,OPC 基金会发布了PackML 的配套规范(OPC 30050: PackML - Packaging Control)。意味着可以使用OPCUA 信息模型来构建PackML 模型了。基于OPCUA PackML 的模型可以对应HTML5 的PackML HMI 面板。
告警

对应OPCUA 的Alarm ,condition 和event 模型.

历史趋势

显示某些数据的历史演变趋势图。

HMI 信息

与HMI相关的某些信息。

多设备系统

多设备系统除了单一设备系统具有的信息模型之外,有一个系统视图(system views)。它是系统中设备和部件的布局图,使用图形符号表示部件,并且包含了表示工艺流程,逻辑关系的连线。

系统视图 可以使用图形工具制作的2D 图形,可以使用SVG,DXF 等格式。比如类似的P&ID 图形。点击系统视图中的图标:

  • 如果图标是一个多设备子系统,跳转到该子系统的系统视图页面
  • 如果是单一设备系统,跳转到该设备的外部特征显示页面

分层系统

分层系统中的每一个子系统有一个系统视图,分层显示。

HML5 页面结构

HTML5的主要页面

系统视图

系统视图可以是系统架构图,现场设备布置图,工艺流程图等图形,它们使用CAD 或者图形编辑工具绘制,格式可以为DXF,SVG 等结构化描述的图形。每个图符号能够实现点击选择。并且包含了一些元数据,可以实现元数据的显示。比如设备名称,外部特征,设备状态,告警等。

为了统一起见,单设备系统的系统视图可以是一个设备图形符号的系统视图。

状态监督

使用HTML5 仪表 UI ,例如JQwidgets

操作控制

按键面板。对应对象中包含的Method。

系统告警

使用HTML5 表格(jqxGrid )。

数据分析

显示系统/子系统的详细特征。并且可以显示数据的趋势信息。例如使用jqxChart。

总结

在设想的系统中,工程设计中只要绘制系统、子系统的系统视图。其它都通过标准的HTML5 UI元素实现。

实现"自动化的自动化",自动化人将自己从手劳作中解放出来!这是值得探索的课题。

相关推荐
python算法(魔法师版)18 小时前
HTML5 Canvas和JavaScript的3D粒子星系效果
javascript·3d·html5
Beginner x_u21 小时前
HTML-拓展知识 字符实体与URL地址
html5·url·字符实体
python算法(魔法师版)1 天前
旅游风景的代码项目
javascript·css3·html5·旅游·风景
浪浪山小白兔1 天前
深入理解JavaScript中的Location对象
开发语言·前端·javascript·html·html5
我命由我123452 天前
NPM 与 Node.js 版本兼容问题:npm warn cli npm does not support Node.js
前端·javascript·前端框架·npm·node.js·html5·js
浪浪山小白兔2 天前
HTML5 语义元素详解
前端·html·html5
浪浪山小白兔3 天前
HTML5 新表单属性详解
前端·html·html5
浪浪山小白兔3 天前
HTML5 常用事件详解
前端·html·html5
PABL014 天前
uniapps使用HTML5的io模块拷贝文件目录
sqlite·uniapp·html5
陈奕迅本讯4 天前
HTML5和CSS3拔高
前端·css3·html5