一个网页上可组态图形、手机上图形监控是工程师比较喜欢的功能,不需要定制APP,不需要定制网站,又要保证手机监控工程的灵活性,简单易用成本低,下面体验下巨控GrmWebGUIDev的网页图形监控功能。
一、设置思路
让现场的GRM500模块采集PLC数据,在GrmWebGUIDev 开发环境组态好WEB图形界面,图形界面和现场的GRM500模块关联起来。界面开发完成以后上传到巨控WebGui云服务器即可在网页云平台上面看到组态好的实时图形界面,手机和电脑打开网页都可以看到图形动画效果。
二、 测试目标
1、 在网页上生成漂亮的图形界面
2、 可以自由切换不同的工程现场
3、 同一个工程切换不同的窗口界面
4、 图形的方式控制现场
5、 图形界面的方式监测现场数据
6、 生成历史曲线图
三、 软硬件准备
1、本项目使用3台GRM500模块,分为A\B\C 3个项目现场,分别用1个 GRM500模块。
2、安装GrmWebGUIDev 开发环境
四、 设置步骤
1、 为了让效果更好,把固定的静态图形做成3D图片放进WEBGUI开发环境窗口。制作背景图形可以应用PS或者用其他图形软件制作3D图片,作为工控人也可以用普通组态软件画好图形,并且生成图片,巨控Gaintview组态软件有生成图片功能。
2、 打开GrmWebGUIDev 开发环境,新建工程,设定画面尺寸。
3、选择工程模式:此处选择动态多设备模式
4、由于A和B两个现场是一样的工程项目即WEB上相同的“变量”关联到不同的模块,那么需要定义模块指针。定义2个指针,“现场A类设备”作为A和B现场模块指针,“现场B类设备”作为C现场模块指针。添加现场GRM设备,在设备管理器中添加设备,定义设备名称和GRM500模块序列号和密码,并且把模块分配到相应的设备指针。
需要注意的是:这里引入了设备指针管理器的概念,主要作用切换不同的工程数据,比如设备生产厂商,每台设备用了1个GRM500模块,生产的设备每一台是相同的,那么可以用同一个监控画面,切换到不同的设备上。
5、制作3D图片,添加到工程组成多状态图片。添加窗口标题,添加文本显示,按钮等。
6、制作历史曲线图,GRM500模块自带云端数据存储,支持断线续传,网络恢复自动补发,保证历史数据不丢失,在WEB GUI里面添加历史数据变量,以曲线的方式展示出来。
7、开发完成后可以打开仿真运行网页
切换现场
8、制作完毕以后,压缩打包工程,把文件上传到WEBGUI服务器即可远程网页图形界面监控、手机图形监控。
电脑端看看效果:
手机端看看效果: