实时曲线组件以曲线展示数据,在图表类组件中比较特殊(X轴一定是时间)。该组件可绑定设备数据源使用,支持单个设备的多个属性或多个设备的单个属性的实时或历史数据可视化。本文介绍实时曲线组件的配置和使用方法。

前提条件

参考以下操作完成Web应用创建。
  1. 创建普通项目
  2. 创建Web应用

操作步骤

本文主要介绍组件样式的个性配置。有关组件样式的通用配置,请参见样式配置

  1. 在Web可视化编辑页面,单击最左侧的组件图标组件
  2. 在画布左侧组件下拉列表,选择基础组件,并展开图表列表。
  3. 拖拽一个实时曲线组件到画布中,单击右侧样式展示数据对应配置数据源
    实时曲线
  4. 在展开的数据源配置面板,根据配置项说明(见下表)完成数据源配置,并单击确定
    数据源配置
    配置项 说明
    选择数据源 默认勾选设备。不支持修改。
    模式 选择实时曲线展示模式。可选:
    • 单设备多属性
    • 多设备单属性
    产品 选择设备所属产品。下拉框中,会展示当前应用所属项目中已导入的产品。

    如果没有相应产品,请单击左上角的项目名称,前往项目页创建或导入产品。

    设备 选择该组件的数据源设备。
    • 指定设备:如果已有真实设备连接到物联网平台,则选择真实设备。如果真实设备未连接到物联网平台,没有上报数据,则需使用虚拟设备功能,推送模拟数据,进行数据格式验证。详细内容请参见调试虚拟设备
    • 动态设备:可选变量、组件值和URL参数三种类型的动态设备。
      • 变量:选择在当前应用中,已创建的变量作为动态设备来源。创建变量,请参见变量管理
      • 组件值:选择当前应用中,已配置的表单组件作为动态设备来源。
      • URL参数:以最终发布页面上的某个参数作为该服务的动态设备。常用于嵌入页面时,由宿主页提供动态参数,如将传入的产品型号作为服务的动态设备。
    • 空设备:若选择为空,可在设备模拟数据框中,输入模拟数据,进行数据格式验证。
    数据项 默认选择设备历史数据。不支持修改。

    使用属性的历史数据作为数据项,例如,可获取过去7天的温度展示。

    属性 选择设备属性。该组件支持以下类型的设备属性:单精度数字,双精度数字,整数。
    实时数据时间段 支持以下两种选择:
    • 选择某个时间点至现在:可选时间点为1小时、0.5天、1天、2天、3天、4天、5天、6天、7天。
    • 选中当天0点-24点
    时间单位 选择时间单位,即以某个时间段为一个单位,可选:5分钟、10分钟、1小时。
  5. 根据配置项说明(见下表)完成数据展示样式的配置。
    配置项 说明
    时间选择器 选中对应复选框,支持筛查历史数据。组件左上角显示可筛选的查询项。
    全局样式 设置实时曲线的全局字体、轴颜色和背景颜色。
    X轴 选中显示轴标签复选框后,显示X、Y轴刻度值。 可设置字号、颜色、粗细、Y轴数值(最大值、最小值、刻度数量)。
    说明 Y轴刻度数量从最小值所在刻度算起,例如最小值为0,最大值为500,间隔为50,刻度数量为11。
    样式:Y轴
    边框 设置是否显示边框。默认显示,支持设置边框粗细、颜色和样式。
    是否显示系列名称 选中对应复选框后,在实时曲线上方显示系列名称。支持添加系列,并设置各系列的名称和对应曲线显示颜色。
  6. 可选:在Web可视化编辑页面,选中目标组件的交互页签,配置事件和交互动作。详细配置指导请参见交互配置
  7. 单击页面右上方的预览,查看或调试组件的展示数据。