实时曲线组件以时间作为X轴，展示单个或多个设备属性的实时或历史数据变化趋势。本文介绍实时曲线组件的详细配置方法。

步骤一：添加组件

  1. 创建Web应用。具体操作，请参见创建Web应用。
  2. 在Web应用编辑器中，单击最左侧的组件图标组件。
  3. 在画布左侧组件列表上方，输入实时曲线，找到该组件，然后将组件拖拽到中间画布。

    有关组件添加的更多信息，请参见添加组件。

    实时曲线

步骤二：配置数据源

  1. 在Web应用编辑器右侧样式中，单击展示数据后的配置数据源。
  2. 配置设备数据源参数项。
    数据源配置
    配置项说明
    选择数据源默认为设备。不支持修改。
    模式选择待展示的曲线：
    • 单设备多属性：最多支持15个属性。
    • 多设备单属性：最多支持5个设备。
    产品单击选择产品，在选择产品对话框选择目标产品。

    选择产品对话框展示了当前应用所属项目下已导入的产品。 如果没有相应产品，单击对话框左下角的产品管理，前往项目详情的产品页，创建或导入产品。

    设备选择待绑定的设备。
    • 指定设备：如果已有真实设备连接到物联网平台，则选择真实设备。如果真实设备未连接到物联网平台，没有上报数据，则需使用设备模拟器功能，推送模拟数据，进行数据格式验证。具体操作，请参见设备模拟器。
    • 动态设备：可选页面变量、组件值、URL参数和来自交互动作四种类型的动态设备。
      • 页面变量：选择在当前应用中，已创建的页面变量作为动态设备来源。创建页面变量具体操作，请参见页面变量管理。
      • 组件值：选择当前应用中，已配置的表单组件作为动态设备来源。
      • URL参数：以最终发布页面上的某个参数作为该服务的动态设备。常用于嵌入页面时，由宿主页提供动态参数，如将传入的产品型号作为服务的动态设备。
      • 来自交互动作：最终以交互页签配置的弹窗数据源，作为动态设备来源。详细信息，请参见打开弹窗容器。
        重要
        • 仅弹窗组件支持将动态设备选择为来自交互动作。
        • 必须在单击配置数据源打开数据源配置弹窗后，设置设备项为动态设备。
    • 空设备：若选择为空，可在设备模拟数据框中，输入模拟数据，进行数据格式验证。
    数据项默认选择设备历史数据。不支持修改。

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

    属性选择设备属性。该组件支持以下类型的设备属性：单精度数字，双精度数字，整数。
    实时数据时间段支持以下两种选择：
    • 某个时间点至现在：可选时间点为1小时、0.5天、1天、2天、3天、4天、5天、6天、7天。
    • 当天0点-24点。
    时间单位选择时间单位，即以某个时间段为一个单位，可选：5分钟、10分钟、1小时。
  3. 单击确定。
    组件默认展示所配数据源的实时数据曲线。

步骤三：配置样式

  1. 在Web应用编辑器右侧样式中，完成组件展示的配置。
    配置项说明
    时间选择器选中对应复选框，支持筛查历史数据。组件左上角显示可筛选的查询项。
    全局样式设置实时曲线的全局字体、轴颜色和背景颜色。
    X轴选中显示轴标签复选框后，显示X、Y轴刻度值。 可设置显示样式。
    说明 Y轴刻度数量从最小值所在刻度算起，例如最小值为0，最大值为500，间隔为50，刻度数量为11。
    Y轴
    边框设置是否显示边框，及可显示的效果。
    辅助线1默认不显示辅助线。打开辅助线开关后，会在实时曲线中显示辅助线，并可设置辅助线的显示样式。
    辅助线2
    是否显示系列名称默认选中该复选框，在实时曲线上方显示系列名称。支持添加系列，并设置各系列的名称和对应曲线显示颜色。
    说明 您可在预览页，单击实时曲线上方显示的系列名称，隐藏对应的曲线。
  2. 调整组件在页面中的最终位置。有关组件通用样式配置的更多信息，请参见样式配置。

步骤四：配置交互动作

  1. 在Web应用编辑器右侧交互中，单击新增交互，设置事件和动作。

    该组件支持鼠标移入事件。例如，鼠标移入，执行动作展示隐藏，显示某个隐藏的组件，展示组件数据更多的说明信息。

    具体操作，请参见交互配置。

  2. 单击页面右上方的预览，预览和调试组件展示的数据和效果。