今天给大家带来基于阿里云 IoT 物联网平台 + Tablestore 表格存储数据库 + DataV大屏 三大云产品组合搭建实时环境监控大屏的开发实战。

    少啰嗦，先看效果。
    image.png
    部署后效果

    ** 1.技 术 架 构 **
    我们在室内每层部署 4 个温湿度传感器，实时采集数据，每10秒发送到阿里云 IoT 物联网平台，通过规则引擎写入 表格存储 Tablestore数据库。在DataV大屏工作台，创建可视化大屏，实时展示室内温湿度变化曲线。

    技术架构如下：

    image.png
    2.IoT 物联网开发

    2.1 创建产品和注册设备

    首先，我们登陆 IoT 物联网平台的控制台，创建产品温湿度环境监测器，并在功能定义中添加温度和湿度两个属性，如下图：
    image.png

    然后，我们在产品下注册一个设备，获取设备身份证书，用于设备和IoT云平台建立MQTT长连接时的身份认证。
    image.png

    2.2 配置云产品流转

    1.4.配置规则引擎，实时流转数据到 TSDB中
    image.png

    编写数据处理 SQL：
    image.png
    完整 SQL 参考：

    1. SELECT 
    2. deviceName() as deviceName, 
    3. timestamp('yyyy-MM-dd HH:mm:ss') as time, 
    4. attribute('floor') as floor, 
    5. items.temperature.value as temperature, 
    6. items.humidity.value as humidity 
    7. FROM 
    8. "/a1kRdXDgN0v/+/thing/event/property/post"

    数据转发：

    image.png
    2.3 设备端程序脚本

    我们以 Node.js 脚本来模拟设备上报温度和湿度，代码如下：

    1. // 依赖mqtt库
    2. const mqtt = require('aliyun-iot-mqtt');
    3. // 设备身份
    4. var options = {
    5.     productKey: "设备 productKey",
    6.     deviceName: "设备 deviceName",
    7.     deviceSecret: "设备 deviceSecret",
    8.     regionId: "cn-shanghai"
    9. };
    10. // 建立连接
    11. const client = mqtt.getAliyunIotMqttClient(options);
    12. //模拟 设备 上报数据（原始报文）
    13. setInterval(function() {
    14.     client.publish(
    15.       `/sys/${options.productKey}/${options.deviceName}/thing/event/property/post`
    16.       , getPostData()
    17.       );
    18. }, 10 * 1000);
    19. // 模拟 温湿度
    20. function getPostData() {
    21.     const payload = {
    22.         id: Date.now(),
    23.         version:"1.0",
    24.         params: {
    25.             temperature: 10+Math.floor(Math.random() * Math.floor(50)),
    26.             humidity: 10+Math.floor(Math.random() * Math.floor(50))
    27.         },
    28.         method: "thing.event.property.post"
    29.     }
    30.     console.log("payload=[ " + payload + " ]")
    31.     return JSON.stringify(payload);
    32. }

    3.表格存储 Tablestore

    3.1 创建表格存储数据表

    我们在表格存储控制台，创建数据库iotMsg，并创建iot_thermometer_data 数据表，其中以deviceName 和 time 为主键列，如下图：

    image.png
    3.2 实时存储的环境数据

    当设备启动后，我们就会在数据库中看到实时的温湿度数据，如下图：
    image.png
    4.DataV 可视化大屏

    设备实时上报数据通过IoT物联网平台实时流转到表格存储数据库后，接下来的工作就是把数据可视化呈现出来，这时就用到了DataV可视化大屏云产品。

    4.1 添加数据源

    我们进入DataV控制台，在我的数据下，添加数据源，输入表格存储实例iot_data的访问路径和AccessKey身份信息，如下图：
    image.png

    4.2 搭建大屏页面

    配置完数据源后，在DataV控制的我的可视化下面创建一个大屏，根据业务需求添加可视化组件，并为每个组件配置相关的数据源，以及过滤器用来适配数据格式，如下图：

    image.png
    4.3 发布实时监控大屏

    当我们完成组件的数据源配置后，就可以发布可视化大屏了。发布后，用户可以通过浏览器访问，如下图：
    image.png