基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏

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

少啰嗦,先看效果。
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏
部署后效果

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

技术架构如下:
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏

   2.IoT 物联网开发   

2.1  创建产品和注册设备

首先,我们登陆 IoT 物联网平台的控制台,创建产品温湿度环境监测器,并在功能定义中添加温度和湿度两个属性,如下图:
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏

然后,我们在产品下注册一个设备,获取设备身份证书,用于设备和IoT云平台建立MQTT长连接时的身份认证。
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏

2.2  配置云产品流转

1.4.配置规则引擎,实时流转数据到 TSDB中
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏

编写数据处理 SQL:
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏
完整 SQL 参考:

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

数据转发:
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏

2.3  设备端程序脚本

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

// 依赖mqtt库
const mqtt = require('aliyun-iot-mqtt');
// 设备身份
var options = {
    productKey: "设备 productKey",
    deviceName: "设备 deviceName",
    deviceSecret: "设备 deviceSecret",
    regionId: "cn-shanghai"
};
// 建立连接
const client = mqtt.getAliyunIotMqttClient(options);
//模拟 设备 上报数据(原始报文)
setInterval(function() {
    client.publish(
      `/sys/${options.productKey}/${options.deviceName}/thing/event/property/post`
      , getPostData()
      );
}, 10 * 1000);
// 模拟 温湿度
function getPostData() {
    const payload = {
        id: Date.now(),
        version:"1.0",
        params: {
            temperature: 10+Math.floor(Math.random() * Math.floor(50)),
            humidity: 10+Math.floor(Math.random() * Math.floor(50))
        },
        method: "thing.event.property.post"
    }
    console.log("payload=[ " + payload + " ]")
    return JSON.stringify(payload);
}

  3.表格存储 Tablestore  

3.1  创建表格存储数据表

我们在表格存储控制台,创建数据库iotMsg,并创建iot_thermometer_data 数据表,其中以 deviceNametime 为主键列,如下图:
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏

3.2  实时存储的环境数据

当设备启动后,我们就会在数据库中看到实时的温湿度数据,如下图:
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏
   4.DataV 可视化大屏   

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

4.1  添加数据源

我们进入DataV控制台,在我的数据下,添加数据源,输入表格存储实例iot_data的访问路径和AccessKey身份信息,如下图:
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏

4.2  搭建大屏页面

配置完数据源后,在DataV控制的我的可视化下面创建一个大屏,根据业务需求添加可视化组件,并为每个组件配置相关的数据源,以及过滤器用来适配数据格式,如下图:
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏

4.3  发布实时监控大屏

当我们完成组件的数据源配置后,就可以发布可视化大屏了。发布后,用户可以通过浏览器访问,如下图:
基于 IoT物联网 + 表格存储DB + DataV 搭建实时环境监控大屏

往期推荐

1、不讲武德,上班摸鱼,监控老板行踪
2、微信小程序 MQTT模拟器
3、自建MQTT集群迁移阿里云IoT实践
4、IoT+TSDB+Quick BI 搭建楼宇环境监控

上一篇:Java Arrays类进行数组排序


下一篇:[LeetCode] Longest Substring with At Least K Repeating Characters 至少有K个重复字符的最长子字符串