利用阿里云物联网平台(IoT)实现WEB数据可视化
暂时先用这个名字 2024-06-10 15:03:06 阅读 55
一年前在阿里物联网平台测试过一个项目,后来就搁置了,昨天有事需要用,发现出错了。
调整完后写一下使用思路,以便未来之需。
阿里云物联网(IoT)主页:https://iot.aliyun.com/
阿里云物联网(IoT)市场:https://linkmarket.aliyun.com/
阿里云物联网(IoT)平台管理:https://iot.console.aliyun.com/
阿里云物联网(IoT)应用开发:https://studio.iot.aliyun.com/
阿里云物联网(IoT)Web可视化开发文档:https://help.aliyun.com/document_detail/110475.html
阿里云IoT是物联网平台,能将你的设备接入云端实现相关功能。本文并不介绍硬件接入的方法,只记录WEB数据可视化的方法。
一、入口
如何注册阿里云就不说了,登录后输入“物联网平台”,或者点击本地址:https://iot.console.aliyun.com/,进入平台。
二、创建实例
如果要用于生产环境,那么购买企业版实例即可,这里仅是开发环境,点击公共实例即可。
公共实例仅用于测试,设备数限制500个,最多同时在线50个,消息上下行TPS限制5、规则引擎TPS限制5,如您需要商用请使用企业版实例,升级操作无法撤销。
本文用不到这里的功能
三、应用开发
1. 打开开发环境
点击 增值服务
-> IoT Studio(物联网应用开发)
或者点击https://studio.iot.aliyun.com/tool/web
2. 新建项目和应用
根据业务需要选择,这里在Web应用
下点+新建
选择 新建项目
新建空白项目
,也可以从市场选择一个新建
项目建完后回到应用创建页面,输入应用名称
,确定
提交
这时Web应用
列表里就有了新建的应用,点编辑
进入编辑界面
3. 编辑页面
编辑界面中有页面管理
、组件管理
、设备绑定
和应用设置
将需要的组件拖入右侧页面中即可
拖拽、合组、命名等操作不再赘述,就和一般的Web UI开发是一样的。
4.数据调用
在页面中选中允许显示数据的组件,点击展示数据
右侧的编辑按钮
在请求地址位置输入远程服务器的地址
如果地址正确,那么将获取返回结果
根据请求参数进行调用获取接口返回的原始值,可以使用脚本或数据表配置进行再加工直至满足组件显示的需求
返回结果满足以下格式,那么该组件读取后就能正确显示内容,无论该组件是图表还是数字
{ "data": [ { "city": "Hangzhou", "month": "Jan", "sales": 360, "cost": 150 }, { "city": "Shanghai", "month": "Jan", "sales": 420, "cost": 180 }, { "city": "Hangzhou", "month": "Feb", "sales": 320, "cost": 140 }, { "city": "Shanghai", "month": "Feb", "sales": 400, "cost": 170 }, { "city": "Hangzhou", "month": "Mar", "sales": 380, "cost": 120 }, { "city": "Shanghai", "month": "Mar", "sales": 450, "cost": 140 } ]}
其它组件及参数设置不再一一分析,可自行研究
这里举例折线图,从数据源读取到数据后,根据折线图要求将对应参数拖入横轴
与纵轴
即可。
5. 域名设置
在应用设置中增加域名即可,没有自己的域名无法直接访问。
6. 应用发布
在右上角点击发布
按钮
写入版本说明点确定
按钮发布
发布成功
可通过域名在线浏览
四、升级企业版
之前一直都是免费测试环境,那么如果要升级为企业版,请点击“升级企业版”
弹出菜单
选择自己所需付款吧~
声明
本文内容仅代表作者观点,或转载于其他网站,本站不以此文作为商业用途
如有涉及侵权,请联系本站进行删除
转载本站原创文章,请注明来源及作者。