【乐吾乐大屏可视化组态编辑器】数据绑定
1. 创建变量列表
在线使用:https://v.le5le.com/
① 左侧tab栏选择“数据”,选择“列表”项
② 点击新建变量,这里创建三个变量
③ 可以点击“保存为我的数据列表”/“下载为Excel”方便下次使用。
2. 图元绑定变量
什么是绑定变量?
绑定变量是指把图元的一个属性与设备数据点关联的一个过程。
① 选中图元,选择“数据”面板,鼠标移入“添加动态数据”,默认选择文字,方便数据展示。
(也可以根据自己的业务需求和图元属性,去给其他属性绑定变量。注意如果需要数据直接显示到页面,必须选择文字属性)
② 点击“绑定变量”图标,弹出对话框中,选择“绑定变量”标签页,勾选上述步骤建立的变量列表中的一项,点击确定完成变量绑定。
(其他图元的属性绑定变量也是一样的步骤。)
3. 建立数据通信(数据获取)
① 数据-选择获取,点击右上角“+”图标,添加通信配置。
② 根据业务需求,选择对应的通信方式,完成通信配置后,点击确定,建立通信。
选择http协议,可以用官方提供的测试地址测试(/api/device/data?mock=1)。
【注意】https开头的网址,只支持https或wss开头的通信地址
浏览器只支持http(s)/ws(s)开头的协议(http地址对应ws协议,https地址对应wss协议)。mqtt开头协议是c/s下使用的,不能用于浏览器。
可以勾选“同时保存到我的数据获取”,以便该通信配置下次直接使用。
通信返回数据格式:(注意:官方测试接口返回中有dataId是2d的老格式,大屏最新的格式是id!!!)
推送的数据变量名和绑定的变量名是对应的
[{"id": "10-300", //变量名 推送的数据变量名和绑定的变量名是对应的"value": 48 //值
},
{"id": "data-0-1000","value": 3640
},
{"id": "f-0.1-10","value": 1.423326
},
//....
]
Copy
③ 可以观察到页面开始实时动态数据变化。
-----------------------------------------------------------------------分隔符---------------------------------------------------------------------------------------------------------------------
以下为老UI页面创建方式
1. 创建变量列表
① 顶部菜单栏点击“数据管理”,弹出框选择“变量列表”。
② 点击“新建变量”,添加三个变量。
③ 可以点击“保存为我的变量列表”/下载Excel文件,方便下次使用。
2. 图元绑定变量
什么是绑定变量?
绑定变量是指把图元的一个属性与设备数据点关联的一个过程。
① 选中图元,选择“数据”面板,鼠标移入“添加动态数据”,默认选择文字,方便数据展示。
也可以根据自己的业务需求和图元属性,去给其他属性绑定变量。
② 点击“绑定变量”图标,弹出对话框中,选择绑定变量标签页,勾选上述步骤建立的变量列表中的一项,点击确定完成变量绑定。
其他图元的属性绑定变量也是一样的步骤。
3. 建立数据通信(数据获取)
① 顶部菜单栏点击“数据管理”图标,切换到“数据获取”标签页,点击“添加数据获取”去配置通信。
② 根据业务需求,选择对应的通信方式,完成通信配置后,点击确定,建立通信。
选择http协议,可以用官方提供的测试地址测试(/api/device/data?mock=1)。
可以勾选“同时保存到我的数据获取”,以便该通信配置下次直接使用。
通信返回数据格式:
[{"id": "data-0-1000", //变量名"value": 648 //值
},
{"id": "data-100-10000","value": 3640
},
{"id": "data-f10-37","value": 31.423326
},
//....
]
Copy
③ 可以观察到页面开始实时动态数据变化。