如何创建模板大屏并显示所有产品和设备数量-阿里云帮助中心

本文以通用设备运维大屏模板和数据分析API数据源为例，演示开发大屏应用的方法，并在大屏应用中显示当前物联网账号下所有的产品及产品中包含的设备数量。

前提条件

已完成Web应用的创建。详细内容请参见创建Web应用。

步骤一：创建模板大屏

打开Web可视化应用编辑页面。
在左侧菜单栏选择。
在下拉框中选择基础组件。
拖拽一个大屏组件到画布。
在选择大屏模板窗口选择通用设备运维大屏，单击根据模板新建。
（可选）
（可选）调整大屏模板显示位置和比例。

步骤二：配置组件数据

选中Web可视化应用编辑页面中画布上的大屏组件，单击右侧样式栏的编辑大屏。
在新打开的IoT大屏编辑|编辑器页面，设置组件数据源。
在数据分析服务中创建数据分析API。
1. 在物联网平台控制台，选择数据分析。
2. 在顶部导航栏上选择分析透视，单击SQL分析页签，进入SQL分析列表页。
3. 单击新建SQL分析，创建SQL分析任务。
4. 通过产品表和设备表，创建API服务并发布，使其返回产品名称及其设备数量（counts）。
  
  更多详细指导操作请参见SQL分析。在SQL编辑器中，使用系统变量 ${system.product} 和 ${system.device} 关联产品表与设备表，按产品名称分组统计设备数量。单击发布后，弹出发布成功对话框，提示API已被发布至数据服务列表，可单击立即查看跳转查看API详情。
（可选）
配置数据分析API数据源。
1. 在IoT大屏编辑|编辑器页面，选中通用设备运维大屏右上方设备品类详情下的轮播列表柱状图组件，并选择数据源配置页签。
  
  数据源配置页签中，字段映射 value 对应 counts、content 对应产品名称，均匹配成功。数据源为 iot-la，已勾选自动更新请求（60秒一次）。单击配置数据源按钮可修改数据源配置。
2. 根据已创建的数据分析API返回数据的字段，设置字段映射关系。
  
  例如，将 value 字段映射为 counts，将 content 字段映射为 产品名称。
3. 单击配置数据源。
4. 在设置数据源配置面板，选择数据分析API数据源类型，并选择已创建好的API（例如：getProAll）。
  
  在下方字段映射区域，将 value 映射为 counts（说明：值），将 content 映射为 产品名称（说明：内容）。配置完成后可在数据响应结果区域预览返回的 JSON 数据。
5. 关闭设置数据源配置面板。
6. 查看数据响应结果及组件显示。
  
  在轮播列表柱状图配置面板的数据接口配置区域，字段映射 value 对应 counts、content 对应产品名称，均显示匹配成功。数据响应结果以 JSON 格式返回各产品名称及对应数量，左侧组件预览区域已正确渲染轮播列表柱状图效果。
您可参考以上步骤，为各个组件配置数据源，完成后，大屏应用中将降序显示当前物联网账号下所有的产品及产品中包含的设备数量。