图元属性对照
数据绑定、动作中的“更改属性”、状态切换和脚本更新最终都会落到图元属性上。配置时可以优先使用下表中的中文属性；如果使用自定义属性或脚本写法，则建议使用对应的内部字段名。
TIP
属性名支持点路径写法，例如 echarts.option.dataset.source、echarts.option.series.0.data。更新嵌套属性时，请保证推送数据类型与原属性类型一致。
常用绑定属性
| 面板属性 | 内部字段 | 数据类型 | 说明 | 示例值 |
|---|---|---|---|---|
| 自定义 | 自定义字段或点路径 | 任意 | 给图元任意属性赋值，也可写入业务字段或组件私有字段 | device.status、extData.temperature |
| X | x / rect.x | number | 图元左上角在画布中的 X 坐标 | 120 |
| Y | y / rect.y | number | 图元左上角在画布中的 Y 坐标 | 80 |
| 宽 | width / rect.width | number | 图元宽度 | 240 |
| 高 | height / rect.height | number | 图元高度 | 120 |
| 显示 | visible | boolean | 控制图元显示或隐藏，false 隐藏，true 显示 | true |
| 文字 | text | string / number | 修改图元显示文本，文本图元、按钮、标签等常用 | "运行中" |
| 进度 | progress | number | 修改进度类图元的进度值 | 76 |
| 状态 | status | number / string | 切换图元状态，需先在状态面板配置对应状态 | 1 |
| 旋转 | rotate | number | 图元旋转角度，单位为度 | 45 |
样式属性
| 面板属性 | 内部字段 | 数据类型 | 说明 | 示例值 |
|---|---|---|---|---|
| 文字颜色 | color | string | 文本颜色 | "#ffffff" |
| 背景颜色 | background | string | 图元背景色 | "#1677ff" |
| 边框颜色 | borderColor | string | 图元边框颜色 | "#ff4d4f" |
| 边框宽度 | borderWidth | number | 图元边框线宽 | 2 |
| 透明度 | globalAlpha | number | 图元透明度，通常为 0 到 1 | 0.6 |
| 字号 | fontSize | number | 文本字号 | 16 |
| 字重 | fontWeight | string / number | 文本字重 | "bold" |
| 对齐方式 | textAlign | string | 文本水平对齐 | "center" |
| 垂直对齐 | textBaseline | string | 文本垂直对齐 | "middle" |
连线与路径属性
| 面板属性 | 内部字段 | 数据类型 | 说明 | 示例值 |
|---|---|---|---|---|
| 线条颜色 | color | string | 连线或路径颜色 | "#00ff88" |
| 线宽 | lineWidth | number | 连线宽度 | 3 |
| 线条样式 | dash / lineDash | number / array | 虚线样式，具体取值以图元配置为准 | [8, 4] |
| 起点箭头 | fromArrow | string | 连线起点箭头样式 | "triangle" |
| 终点箭头 | toArrow | string | 连线终点箭头样式 | "triangleSolid" |
| 流动动画 | animate | boolean | 控制连线动画是否播放 | true |
| 动画速度 | animateSpan | number | 控制连线流动动画速度 | 2 |
控件属性
| 场景 | 属性写法 | 新增动态数据选项 | 数据类型 | 说明 |
|---|---|---|---|---|
| 文本 | text | 文字 | string / number | 修改文本控件显示内容 |
| 数字 | text | 自定义 | number / string | 修改数字控件显示值，具体字段以控件配置为准 |
| 进度条 | progress | 进度 | number | 修改进度值 |
| 图标 | icon | 自定义 | string | 修改图标内容或图标编码，具体字段以控件配置为准 |
| 图片 | image | 自定义 | string | 修改图片控件资源地址 |
| gif | image | 自定义 | string | 修改 GIF 控件资源地址，具体字段以控件配置为准 |
| 网页 | iframe / iframe.url | 自定义 | string | 修改网页控件地址 |
| 选项卡 | active | 自定义 | string / number | 切换当前选中的页签，具体字段以控件配置为准 |
| 按钮 | text | 文字 | string | 修改按钮显示文本 |
| 表格 | data / table.data | 自定义 | array | 修改表格数据 |
| 分页 | total / pageSize / current / pageSizeOptions / maxPageBtn | 自定义 | number / array | 修改分页总数、每页条数、当前页、每页条数选项和最大页码按钮数 |
| 输入框 | text | 自定义 | string / number | 修改输入框当前值 |
| 单选框 | data / selectedKey | 自定义 | array / string / number | 修改单选框选项数据和当前选中项 |
| 下拉选择器 | dropdownList / text | 自定义 | array / string / number | 修改下拉选项列表和当前显示/选中值 |
| 开关 | checked | 自定义 | boolean | 修改开关状态 |
| 圆形按钮 | checked | 自定义 | boolean | 修改圆形按钮选中状态 |
| 船型开关 | checked | 自定义 | boolean | 修改船型开关状态 |
| 闸刀 | checked | 自定义 | boolean | 修改闸刀开合状态 |
| 转换开关 | checked | 自定义 | boolean | 修改转换开关状态 |
| 拨动开关 | checked | 自定义 | boolean | 修改拨动开关状态 |
| 空气开关 | switch | 自定义 | boolean | 修改空气开关状态 |
| 颜色选择器 | text | 自定义 | string | 修改颜色选择器当前颜色值 |
| 滑块 | value | 自定义 | number | 修改滑块当前值 |
| 时间 | value / time | 自定义 | string / number / Date | 修改时间控件值，具体格式以控件配置为准 |
| 音频 | audio | 自定义 | string | 修改音频资源地址，具体字段以控件配置为准 |
| 视频 | video | 自定义 | string | 修改视频资源地址 |
| FLV 视频流 | video | 自定义 | string | 修改 FLV 视频流地址，具体字段以控件配置为准 |
图表属性
| 场景 | 属性写法 | 新增动态数据选项 | 数据类型 | 说明 |
|---|---|---|---|---|
| 更新 ECharts 数据集 | echarts.option.dataset.source | 自定义 | array | 推荐用于表格型图表数据更新 |
| 更新 ECharts 系列数据 | echarts.option.series.0.data | 自定义 | array | 更新第一个系列的数据 |
| 更新 ECharts 标题 | echarts.option.title.text | 自定义 | string | 修改图表标题 |
| 更新 ECharts 颜色 | echarts.option.color | 自定义 | array | 批量设置图表主题色 |
Vue3组件属性
| 更新 Vue3 组件参数 | props.xxx / 自定义字段 | Vue3 组件参数 | 任意 | 动态 Vue3 组件可通过属性接收数据，详见动态 Vue3 组件 |
WARNING
属性对照用于配置时快速定位。不同图元支持的属性不完全一致，如果某个属性更新后没有效果，请先确认该图元是否使用该字段参与渲染。