【阿里云IoT+YF3300】13.阿里云IoT Studio WEB监控界面构建

Web可视化开发是阿里云IoT Studio中比较重要的一个功能，通过可视化拖拽的方式，方便地将各种图表组件与设备相关的数据源关联，无需编程，即可将物联网平台上接入的设备数据可视化展现。

目前支持的组件如下图所示：

通过可视化拖拽的方式，方便地将各种图表组件与设备相关的数据源关联，无需编程，即可将物联网平台上接入的设备数据可视化展现。

我们的对接的硬件平台依然是YF3300，相关的配置如下：

当前物联网平台已经直接集成了IoT Studio，如下图所示：

首先我们在阿里云上构建YF3300的物模型，并在此基础上，我们添加温度和湿度这两个属性。

阿里云IoT Studio中的设备管理和物联网平台中的设备管理有些不同，针对IoT Studio来说，是以项目为单位的。产品和设备在同一个项目内是共享的，在不同项目之间是隔离的。因此，为使得IoT Studio中具有访问产品/设备的权限，必须将物联网平台中的设备管理中的产品关联到项目中，或者直接在项目下创建产品和设备（在项目下创建的产品和设备，将直接显示在物联网平台的设备管理模块中）。

在阿里云IoT Studio页面可以新建产品和设备，也可以绑定阿里云物联网平台中的产品和设备。并且在阿里云IoT Studio页面创建的设备，自动会出现在阿里云物联网平台中。

我们拖拉两个仪表盘，和I1和I2还有继电器Q1输出相关的组件。

相关的组件要和产品和物模型进行绑定，如下图所示：

相关配置完成后，直接发布即可。

在浏览器中，我们会直接看到对应的数据和状态发生变化，并且可以直接操作开关，控制实际的物联网设备。

想体验阿里云IoT平台的网友，可以单击如下链接：https://dev.iot.aliyun.com/sale?source=deveco_partner_yefan