网站建设 佛山,大连app开发多少钱,全国大学生网页设计大赛,表白网页制作代码使用阿里云IoT Studio建立物模型可视化界面
上一篇文章介绍了如何使用ESP-01S上报数据到物模型#xff1a;https://blog.csdn.net/weixin_46251230/article/details/128996719
这次使用阿里云IoT Studio建立物模型的Web页面
阿里云IoT Studio#xff1a; https://studio.i…使用阿里云IoT Studio建立物模型可视化界面
上一篇文章介绍了如何使用ESP-01S上报数据到物模型https://blog.csdn.net/weixin_46251230/article/details/128996719
这次使用阿里云IoT Studio建立物模型的Web页面
阿里云IoT Studio https://studio.iot.aliyun.com/
注意IoT Studio免费使用期限是一个月过了一个月之后要付费才能继续使用
创建项目
打开网页后点击项目管理 点击新建项目如果原来有项目的要先删除原来的才能新建体验版只能创建一个项目 点击新建空白项目 输入项目名称 在项目主页点击产品关联 选择关联自己的产品再勾选关联其下所有设备点击确定 产品一栏中已经显示了之前创建的产品信息后续如果要删除产品关联可以点击解除关联设备同理 点击新建Web应用 输入页面名称点击确定
编辑Web页面
创建温度仪表盘
在Web页面中点击组件栏就可以将组件拖动到画板上做出自己的显示页面 选择一个仪表盘并点击在右侧可以为其配置数据源 选择自己的产品设备设备里要显示的属性值这里选择温度最后确定 再配置单位和文字 就设置好了温度仪表盘 点击右上角的预览按钮就可以浏览可视化页面 ESP-01S发送AT指令改变温度值
ATMQTTPUB0,/sys/hiyfcAbCXmq/ESP8266-1/thing/event/property/post,{\method\:\thing.event.property.post\\,\id\:\1234\\,\params\:{\temperature\:33}\,\version\:\1.0.0\},1,0因为配置了数据源所以温度仪表盘的数据被自动改变了 创建按钮开关
创建一个开关并设置数据源为BOOL类型的继电器 在预览的Web页面点击开关时要注意每次点击开关都会往ESP-01S下发数据需要ESP-01S回应数据开关才会设置成功否则会反弹
点击按钮时云平台下发到ESP-01S的数据 若不回应则Web页面显示超时同时按钮没有被打开 在ESP-01S接收到下发数据后立即发送AT指令进行回应 则Web页面显示数据下发成功同时按钮也被正常打开关闭按钮同理要发送关闭继电器的AT指令 创建实时曲线
为实时曲线配置数据源选择单设备多属性属性选择温度值 在交互中添加事件当鼠标点击实时曲线时刷新曲线组件显示最新数据 发送AT指令多设置几次温度值看实时曲线是否显示温度变化 Web界面的实时曲线正确显示改变的温度值如果发现温度值没改变则点击曲线进行刷新横坐标的时间也会刷新左上角显示最后一次温度值符合预期
