[發明專利]一種基于canvas的組態圖形web發布方法

在審

• 申請號: 202011111802.1
• 申請日: 2020-10-16
• 公開（公告）號: CN112328933A
• 公開（公告）日: 2021-02-05
• 發明（設計）人: 韓勇;張玉壘;陶潁軍;趙中華;余勇;張亞萍;趙丹;李燕;崔麗艷;馮凱濱
• 申請（專利權）人: 許繼集團有限公司;許繼電氣股份有限公司;許昌許繼軟件技術有限公司
• 主分類號: G06F16/958
• 分類號: G06F16/958;G06F8/38
• 代理公司: 北京中政聯科專利代理事務所(普通合伙) 11489
• 代理人: 朱曉娟

1.一種基于canvas的組態圖形web發布方法，其特征在于，包括如下步驟：

使用組態工具分別導出模板xml文件和畫面xml文件；

通過前端js解析所述模板xml文件和所述畫面xml文件，并基于canvas進行繪制，同時生成頁面圖元對象并緩存至對象列表；

使所述前端與服務端建立websocket連接；

控制所述服務端的數據更新模塊檢測到有數據變化時向前端頁面推送變化數據，控制所述前端頁面對相應的頁面圖元進行重新繪制。

2.根據權利要求1所述的基于canvas的組態圖形web發布方法，其特征在于，所述生成頁面圖元對象，包括：

生成以instanceid為唯一標識的所述頁面圖元對象。

3.根據權利要求2所述的基于canvas的組態圖形web發布方法，其特征在于，所述服務端的數據更新模塊檢測到有數據變化時向前端頁面推送變化數據、所述前端頁面對變化圖元進行重新繪制，包括：

控制所述數據更新模塊把以instanceid為唯一標識的變化的所述數據包裝成數據傳輸對象發送到所述前端頁面，所述前端頁面在接收到所述數據后根據所述instanceid對相應的圖元進行重新繪制。

4.根據權利要求1所述的基于canvas的組態圖形web發布方法，其特征在于，還包括：

在預設時間范圍內未檢測到所述數據變化時，通過所述前端頁面發送請求，向所述服務端數據更新模塊請求當前所述頁面下所有數據；

使所述服務端數據更新模塊接收到所述請求后查詢對應所述數據的最新值并包裝成所述數據傳輸對象，并返回至所述前端頁面；

所述頁面前端接收所述數據，并進行所述頁面圖元對象的重新繪制。

5.根據權利要求4所述的基于canvas的組態圖形web發布方法，其特征在于，所述進行所述頁面圖元對象的重新繪制之前，還包括：

檢測所述websocket連接是否正常；

如連接異常，則重新建立所述websocket連接。

6.根據權利要求1所述的基于canvas的組態圖形web發布方法，其特征在于，所述緩存至對象列表，包括：

把所述頁面圖元對象按圖元類型分類緩存至所述對象列表，以供所述頁面隨時獲取。

7.根據權利要求1所述的基于canvas的組態圖形web發布方法，其特征在于，所述數據的數據結構包括：圖元對象、關系對象和數據傳輸對象；

所述圖元對象為xml文件解析完成后生成的用于緩存頁面圖元的對象，包含了所述頁面圖元的模板、動作、菜單、樣式和/或位置屬性；

所述關系對象為存儲動態解析后的圖元對象的condition的字段與圖元對象的映射關系；

所述傳輸對象用于前端與服務端進行數據更新，以instanceid為key的存儲有字段-字段值的列表。

8.根據權利要求1所述的基于canvas的組態圖形web發布方法，其特征在于，所述通過前端js解析所述模板xml文件，包括：

在所述前端js解析到所述畫面xml文件有引入所述模板xml文件時，繼續加載所述模板xml文件，并將其緩存至模板文件為key的map中。