ThingsKit物联网平台可视化工具之大屏编辑器

概述

大屏设计器的作用是让用户可以通过简单的拖拽和配置,创建出符合自己需求的网页界面。它可以帮助用户快速构建出完整的网页,而不需要过多的编码知识和复杂的操作。

编辑器的特点

  • 可视化编辑:用户可以通过简单的拖拽和放置,添加网页元素,如文本、图片、视频、图表等。
  • 实时预览:用户可以在编辑过程中实时预览网页效果,以便更好地进行调整和配置。
  • 丰富的内容:编辑器还提供了丰富的模板和样式,可以满足不同用户的需求。
  • 响应式设计:编辑器通常支持响应式设计,可以根据不同的屏幕大小和设备类型,自动调整网页布局和样式。
  • 导入和导出:用户可以将编辑好的页面导出为Json文件,并分享给其他人;导入到编辑器中。

功能区介绍

快捷按钮区域

快捷按钮区域,位置在最上面部分。

从左至右的快捷按钮分别为:

  • 显示/隐藏图表组件
  • 显示/隐藏图层控制
  • 显示/隐藏详情设置
  • 后退 【撤退,回退到上一步】
  • 前进 【使用回退之后,如果存在多余的回退操作,则可以前进一步】
  • 保存内容 【将设计好的内容,进行保存处理】
  • 保存封面缩略图 【模板在大屏管理中所展示的缩略图】
  • 预览 【预览设计出来的效果】
  • 中/英文切换
  • 颜色【全局颜色设置】
  • 主题【全局主题设置】

组件区域

里面包含有所有的展示组件,其中包括图表类、信息类、列表类、小组件、图片类、图标类、组合类等。

图层区域

图层区域,类似于图像处理软件Photoshop中的图层管理一样;具有锁定、隐藏、分组、拖拽等功能;当你设计好某一块内容时,则可以将其此快内容进行合并,方便整体调整位置;锁定功能则是将其整体及位置进行锁定,防止后续误操作。在实际使用中,非常实用。

配置区域

该功能非常强大,主要分为四个部分定制、动画、数据和事件构成。

定制:对组件的样式进行设置,如组件尺寸、组件位置、组件内容的背景颜色、及组件内容的字体大小、字体颜色等个性化设置,自由度非常的高。

动画:则为组件进入页面时,第一次加载出现的入场动画:如弹跳、左右晃动、向下进入等。

数据:主要是为组件提供展示的数据支撑;其中包括静态数据和动态数据。如果是动态数据,系统还提供了过滤器;为满足各种复杂场景的数据构造。

事件:主要是为单个组件与其他组件需要进行交互作用时使用;比如图表组件如果需要为用户提供自定义查询某个时间段的数据时,则需要将日期组件和图表组件进行交互事件,并传递数据。

文章来源(首发地址):ThingsKit物联网平台

相关推荐
MonolithIoT6 小时前
实战方案|智能称重货架:制造业线边仓主动预警式数字化库存管理落地指南
物联网·制造业·线边仓·智能线边仓
星恒讯工业路由器7 小时前
5G工业路由器在智慧工厂中的应用解析:从数据采集到云端管理
物联网·信息与通信·智慧工厂·5g工业路由器·产线数据采集
hongmai6668888 小时前
ESP32-C5-WROOM-1-N16R8:双频Wi-Fi 6与多协议融合,重新定义物联网连接新标准
笔记·嵌入式硬件·物联网·智能路由器·risc-v
延凡科技1 天前
延凡科技电力数字化平台技术解析:从电力交易到虚拟电厂的全链路架构实践
人工智能·科技·物联网·架构·虚拟电厂·电力平台
TDengine (老段)1 天前
TDengine Go 与 Rust 连接器 — 高性能异步访问
大数据·数据库·物联网·golang·rust·时序数据库·tdengine
老孙讲技术1 天前
做过安防后端的人都懂:别把「云录像留证」和「告警外呼叫醒」拆成两套台账——分层搭重大事件触达
物联网·安全
星恒讯工业路由器1 天前
仓储AGV无线组网指南
物联网·信息与通信·工业物联网·仓储物流机器人·agv无线组网·仓储无线覆盖·远程配置
柱子jason1 天前
使用IOT-Tree消息流节点直接开放RESTful Api支持大屏展示
物联网
老孙讲技术1 天前
凌晨三点报警全乱了:一个 callback 地址,如何把设备托管消息拆成多客户流水线?
物联网·音视频开发
国科安芯1 天前
还是4位?ASC8T245S 与 ASC4T245S 的双向电平转换选型实战
单片机·嵌入式硬件·物联网·fpga开发·机器人·云计算