Pages

2. 智能图像控件（Smart Image）

描述

Smart Image 控件支持根据变量值变化显示不同图像。
通过简单 JavaScript 脚本设定条件，不同状态显示不同图像。

支持多种条件判断，并可为每个条件分配对应图像。

核心功能

  • Connection String：绑定的变量或数据源
  • Conditions 条件组：设置多个判断条件
  • Script 脚本：JavaScript 表达式（例如 value == 1）
  • Image URL：当条件满足时显示的图像

示例：设备运行状态

绑定变量：machineStatus
不同值对应不同图标：

值 状态 图像文件
0 停止 red_icon.svg
1 运行中 green_icon.svg
2 报警 yellow_warning.svg

脚本设置如下：


// 条件 1
value == 0
// 图像：red_icon.svg

// 条件 2
value == 1
// 图像：green_icon.svg

// 条件 3
value == 2
// 图像：yellow_warning.svg
// 条件 1 value == 0 // 图像：red_icon.svg // 条件 2 value == 1 // 图像：green_icon.svg // 条件 3 value == 2 // 图像：yellow_warning.svg
2
1
0
machineStatus
value == 1