开发 HMI 应用程序 在 HMI 项目中创建 HMI 应用程序。理想情况下，这个项目最初是用 创建 HMI 项目 向导。您可以在 HMI 透视图和 CODESYS 看法。在 HMI 透视图中，相关对象显示在前景中。它们在 可视化 , 数据源管理器 ， 和 人机界面功能 意见。与 HMI 无关的对象位于 编程 查看并且通常是隐藏的。 提示 选择 HMI 透视图，仅查看与典型 HMI 项目相关的对象

通过趋势记录连接到远程 PLC 通过 HMI 项目，您可以在“趋势”可视化元素中显示远程 PLC 的趋势记录。要求：在远程 PLC 中定义趋势记录并添加符号配置。 将 HMI 应用程序连接到控制器 打开最初创建的 HMI 项目。 选择 数据源管理器 目的。 点击 添加对象→数据源 . 这 添加数据源 对话框打开并帮助您配置数据源。这 CODESYS 象征性的 CODESYS 数据源类型默认设置。如

在可视化中将远程采样数据显示为 HMI 使用 HMI 项目，您可以在 HMI 用户界面中以可视化方式在本地显示远程采样数据。 为此，您可以在本地 HMI 可视化中使用跟踪元素。跟踪元素显示通过数据源传输的数据。远程设备由具有数据源类型的数据源连接 CODESYS 应用V3 .无法通过数据源类型的连接传输跟踪数据 CODESYS 象征性的 .与远程应用程序的逻辑连接在 数据源 财产和 应用 .此外，

为分布式告警管理创建用户界面 您可以在 HMI 设备上创建具有分布式报警管理的应用程序。分布式告警管理是指本地设备发生的告警和网络内设备发生的告警都集中处理。报警信息通过数据源连接进行交换，每个数据源连接都由代理服务器扩展。对于警报信息，您可以创建一个可视化，将网络中的所有警报显示在单个警报元素中。这允许用户在一个警报元素中以清晰组织的可视化方式从中央位置监控网络中的所有设备。 以下部分将逐步描述

开发 HTML5 控件 . 一般的 可以显示 HTML5 控件 只要 上 CODESYS WebVisu s。 如果带有 HTML5 控件的可视化应该在 CODESYS TargetVisu 例如，然后发出警告。 HTML5 控件不在那里显示。 使用 HTML5 控件需要启用覆盖功能。 因此，在可视化管理器中，选择 支持客户端动画和原生元素叠加 选项。否则会发出错误。 有关详细信息，请参阅： 可视

基本程序 您可以在 CODESYS 开发环境。 过程 . 准备 创建 JavaScript 包装器文件 ElementWrapper.js 为控制。 指定运行元素所需的任何文件，例如样式文件 (CSS)、JavaScript 文件 (JS) 或图像文件 (SVG)。 创建元素图像 ElementImage.svg 显示在工具箱中。 过程 . 集成到编程系统中 在 CODESYS , 创建一个 XM

显示信息 在可视化元素存储库中，您可以获得有关项目中安装的元素的信息。如果有疑问，您可以查询签名和卸载元素的状态。 本节内容如下 :

使用没有有效签名的元素 如果没有签名、证书无效或时间戳无效的 HTML5 控件是可视化的一部分，则在生成应用程序代码时，消息视图中会显示一条警告。 在消息视图中， 此警告后显示按钮。单击该按钮时，将显示输入提示。在那里，您可以将被警告的元素设置为在项目中“接受”。然后这个元素将不再被检查，你也不会再收到任何关于它的警告。 本节内容如下 :

链接和使用 HTML5 控件 您可以将 HTML5 控件直接安装到可视化元素存储库中。 可以将 HTML5 控件添加到存储库，以便可以分发包含所有必要内容的项目。 提示 HTML5 控件通常以包的形式提供。然后在包管理器中执行初始安装。 过程 . 首次安装 HTML5 控件 点击 工具 → 可视化元素存储库 . 提示 该命令仅在没有打开项目时可用 CODESYS . 这 视觉元素库 对话框打开。

查看图像文件 注意 HTML5 控件示例 以下选项可用于从 HTML5 控件访问图像。 参考 描述 来自 JavaScript 代码中引用的静态图像 附加文件 该图像在 HTML5 控件编辑器中引用，位于 一般的 选项卡，在 附加文件 场地。 在脚本代码中，实际文件名是通过使用 API “ CDSWebVisuAccess.getAdditionalFile "。然后可以将图像集成到控件中。 来自