一個網頁上可組態圖形、手機上圖形監控是工程師們比較喜歡的功能，不需要定製APP，不需要定製網站，又要保證手機監控工程的靈活性，簡單易用成本低。下面我們就通過巨控GrmWebGUIDev來製作手機APP，實現對PLC遠端無線監控。

一、技術方案

現場採用巨控GRM系列遠端控制終端模組採集PLC資料，實現PLC遠端無線監控，通過巨控的GrmWebGUIDev開發環境組態好遠端監控的圖形介面，將圖形介面通過網路將GRM模組關聯起來，實現和PLC的遠端通訊。圖形介面開發完成以後，上傳到巨控WebGui雲伺服器即可在網頁雲平臺上面看到組態好的實時圖形，實現PLC遠端無線監控，手機和電腦開啟網頁都可以看到圖形動畫畫面。

二、 實現目標

1、 在網頁上生成漂亮的圖形介面

2、 可以自由切換不同的工程現場

3、 同一個工程切換不同的視窗介面

4、 圖形的方式控制現場

5、 圖形介面的方式監測現場資料

6、 生成歷史曲線圖

三、 軟硬體準備

1、本專案使用3臺GRM模組，分為3個專案現場，A現場應用1個GRM200模組，B現場應用1個GRM200模組、C現場應用1個GRM500模組。

2、安裝GrmWebGUIDev 開發環境

四、 設定步驟

1、 為了更好，把固定的靜態圖形做成3D圖片放進WEBGUI開發環境視窗。製作背景圖形可以應用PS或者用其他圖形軟體製作3D圖片，作為工控人也可以用普通組態軟體畫好圖形，並且生成圖片，巨控Gaintview組態軟體有生成圖片功能。

2、 開啟GrmWebGUIDev 開發環境，新建工程，設定畫面尺寸。

3、選擇工程模式：此處我們選用動態多裝置模式

4、由於A和B兩個現場是一樣的工程專案即WEB上相同的“變數”會關聯到不同的模組，那麼需要定義模組的指標。定義了2個指標，“現場A類裝置”作為A現場和B現場模組的指標，“現場B類裝置”作為C現場模組的指標。新增現場GRM裝置，在裝置管理器中新增裝置，定義裝置名稱、GRM模組序列號和密碼，並且把模組分配到相應的裝置指標。

需要注意的是：這裡引入了裝置指標管理器的概念，主要作用切換不同的工程資料，比如裝置生產廠商，每臺裝置用了1個GRM模組，生產的裝置每一臺都是相同的，那麼可以用同一個監控畫面，切換到不同的裝置上。

6、製作歷史曲線圖，模組自帶雲端資料儲存，支援斷線續傳，網路恢復自動補發，保證歷史資料不丟失，在WEB GUI裡面新增歷史資料變數，以曲線的方式展示出來。

7、開發完成後可以開啟模擬執行網頁

切換現場

8、製作完畢以後，壓縮打包工程，把檔案上傳到WEBGUI伺服器即可遠端網頁圖形介面監控、手機圖形監控。大功告成