通过OneNET应用编辑器,用户可以方便快捷地实现OneNET平台上的设备数据流可视化。
通过开发者中心 -> 应用管理进入该服务,点击添加应用,如下图:
应用编辑器控制台如下图:
1.多页面支持
应用支持多个页面,每个页面的控件相互独立。可在页面面板中新增、删除页面、改变页面排放顺序。应用初始化时优先显示排序第一的页面。
2.手机页面
手机页面与普通页面编辑方式类似,应用初始化时,会根据访问设备是否是移动端来判断是否优先显示手机页面。要编辑手机页面,需要点击工具栏按钮进行切换编辑模式。
3.页面设置
编辑区没有控件被选中时,设置面板显示当前编辑页面的设置选项,目前可以设置页面背景色,页面编辑区辅助线,请尽量将控件摆放在编辑辅助线内以获得最好的显示效果。
1.基础控件
基础控件只能可视化设备的数据流值,不能对设备下发命令、修改数据流值。
• 文本控件
文字控件可以使用固定文字,也可以根据数据流来显示内容。可以在样式选项中设置显示的字体,字号,文字的厚度,斜体和下划线,以及文字的颜色,背景色,对齐方式,行距等。
• 折线图
折线图可以选择一条或者多条数据流来进行展示。可以设置折线图的显示效果,颜色。x轴,y轴的样式以及数据点时间格式。
• 柱状图
参考折线图
• 图片控件
图片有三种模式,第一种,就是上传什么图片显示什么图片。第二种,根据数据流设置后得到的数据流链接来显示图片。第三种,上传多张图片,并且给每张图片给定一个值,根据数据流返回的值与设定的值做比较来确定哪张图显示
• 链接控件
链接控件有三种类型,按钮链接,图像链接和文本链接三种。
• 地图
设置好数据流,地图会根据数据来在地图上显示位置
• 仪表盘
根据数据流来显示数据流值。可设置最大值最小值,以及仪表盘的样式。
2.控制控件
控制控件除了能可视化设备的数据流值外,还可以下发命令给设备。
• 旋钮
根据数据流来显示数据流值,可以设置旋钮的最大值,最小值,步长等,还可以在样式中设置表盘,旋钮,数字等颜色。并且在应用中,可以通过拖动旋钮或者设置旋钮中的数字来向设置好的数据流中发送命令。
• 开关
根据数据流是否和设置的开关值来显示开关的样式。点击开关,可以向设置好的数据流发送对应开关值的数据。
• 命令框
设置好数据流后,可以向对应的数据流发送数据。该数据可以分为普通字符串数据,和十六进制数据。
1.新增控件
• 通过点击元件库中的元件图标可往编辑区左上角新增该类型控件
• 鼠标左键按住元件库中元件图标,拖动到编辑区任意位置松开鼠标左键,可在该位置新增控件
• 复制已经存在编辑区的控件后粘贴,可快速新增控件
2.选中控件
• 点击编辑区中的控件可以切换控件的选中、取消选中状态
• 点击图层导航栏中的控件图层可以切换该控件的选中、取消选中状态
• 按住ctrl键时点击编辑区控件可以进行多个控件选中
3.编辑控件
选中要编辑的控件,在设置面板将出现该控件(多选状态下显示最后选中的那个控件)的设置项,可根据不同需求定制控件的样式、设置设备和数据流。
4.删除控件
当控件处于选中状态,可以通过按del键或者点击工具栏删除按钮删除控件
1.拖拽控件改变位置
鼠标点选控件使控件处于选中状态,此时可以拖动控件改变其在编辑区中的位置; 拖动控件四周的大小控制点,可以改变控件的大小
2.对齐控件
当编辑区中被选中的控件不止一个时,工具栏中会出现控件对齐按钮。点击它们会把所选中的控件参照红色边框控件做相应对齐。
3.分布控件
当编辑区中被选中的控件不止两个时,工具栏中会出现控件分布按钮。点击它们会把所选中的控件在相应方向上做均等分布。
4.通过工具栏设置大小
使用工具栏中的大小设置输入框,可以精确控制所选中控件的大小。 打开“保持宽高比例”可以实现按比例缩放。
5. 使用图层导航控制控件层叠顺序
当控件堆叠在一起的时候,处于上层的控件在显示时会遮盖下层控件。通过在图层导航中拖拽图层可以改变控件间的上下层关系。
将多个控件组合在一起,以便同时操作。
1.将选中控件合并成组
点击工具栏组合按钮,可以将选中控件合并成组
2.组内编辑
选中某个组后双击它可以进入到这个组内部,对组内部的控件再次编辑
3.回到父级组
在编辑区空白处双击,可以退出当前编辑的组,返回到父级组(若父级组存在)。
4.解散组合
选中某个组,点击工具栏解散组合按钮,可以将控件从该组中解散出来。
当前仅支持以下操作的撤销与重做
• 新增、删除控件
• 对控件位置、大小有更改的操作
• 组合、解散组合、进入组、退出组
1.预览 点击工具栏 预览 按钮可以将当前编辑区全屏预览,预览仅显示当前编辑页。
2.保存及发布 点击工具栏 保存 按钮,可以保存当前编辑的应用。该操作将保存所有正在编辑中的页面。
快捷键组合 | 功能 | 说明 |
---|---|---|
ctrl+c | 复制 | 可复制控件或者组 |
ctrl+v | 粘贴 | 将剪切板中的控件或组粘贴到编辑区 |
ctrl+z | 撤销 | 撤回到上一步操作 |
ctrl+y | 重做 | 重做上一步操作 |
del | 删除 | 删除选中的控件或组 |