当前位置: 首页 > news >正文

【乐吾乐大屏可视化组态编辑器】数据绑定

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

③ 可以观察到页面开始实时动态数据变化。

相关文章:

  • 北京网站建设多少钱?
  • 辽宁网页制作哪家好_网站建设
  • 高端品牌网站建设_汉中网站制作
  • Mac 连接 Synology NAS【Finder】
  • 【C语言篇】自定义类型:联合体和枚举详细介绍
  • 【django升级】django从2.2.6版本升级到3.2.25
  • 【ubuntu20.04 运行sudo apt-get upgrade报错】
  • 主机加固是什么?主机加固与产线工控安全关系
  • pg_stat_statements插件使用指南
  • NLP——文本预处理-新闻主题分类案例
  • MySQL——数据库的设计、事务、视图
  • GraalVM全面介绍:革新Java应用开发的利器
  • 【循环神经网络】案例:周杰伦歌词文本预测【训练+python代码】
  • 你真正了解低代码么?(国内低代码平台状况分析)
  • 华为od(D卷)最大N个数和最小N个数的和
  • 怎么用云手机进行TikTok矩阵运营
  • OpenTiny HUICharts 正式开源发布,一个简单、易上手的图表组件库
  • 【JAVA】获取object中 key对应的value值
  • 08.Android之View事件问题
  • Android Studio:GIT提交项目到远程仓库
  • Centos6.8 使用rpm安装mysql5.7
  • Flex布局到底解决了什么问题
  • Git 使用集
  • Java知识点总结(JDBC-连接步骤及CRUD)
  • java中具有继承关系的类及其对象初始化顺序
  • js正则,这点儿就够用了
  • react-core-image-upload 一款轻量级图片上传裁剪插件
  • uva 10370 Above Average
  • vue-cli3搭建项目
  • 阿里云Kubernetes容器服务上体验Knative
  • 动手做个聊天室,前端工程师百无聊赖的人生
  • 关于字符编码你应该知道的事情
  • 技术:超级实用的电脑小技巧
  • 聊聊redis的数据结构的应用
  • 如何胜任知名企业的商业数据分析师?
  • 入手阿里云新服务器的部署NODE
  • 深入 Nginx 之配置篇
  • 世界上最简单的无等待算法(getAndIncrement)
  • 限制Java线程池运行线程以及等待线程数量的策略
  • 验证码识别技术——15分钟带你突破各种复杂不定长验证码
  • 栈实现走出迷宫(C++)
  • puppet连载22:define用法
  • #{} 和 ${}区别
  • #Linux(帮助手册)
  • #LLM入门|Prompt#3.3_存储_Memory
  • (Repost) Getting Genode with TrustZone on the i.MX
  • (Ruby)Ubuntu12.04安装Rails环境
  • (附源码)springboot课程在线考试系统 毕业设计 655127
  • (计算机网络)物理层
  • (详细文档!)javaswing图书管理系统+mysql数据库
  • (新)网络工程师考点串讲与真题详解
  • (一)C语言之入门:使用Visual Studio Community 2022运行hello world
  • (一)Java算法:二分查找
  • (一)基于IDEA的JAVA基础12
  • (转)总结使用Unity 3D优化游戏运行性能的经验
  • ****** 二十三 ******、软设笔记【数据库】-数据操作-常用关系操作、关系运算
  • ***测试-HTTP方法
  • .NET 4.0中使用内存映射文件实现进程通讯