[發明專利]基于SVG的Web組態畫面存儲與展示系統和方法及介質

有效

• 申請號: 201910059468.0
• 申請日: 2019-01-22
• 公開（公告）號: CN111459501B
• 公開（公告）日: 2023-08-11
• 發明（設計）人: 孔曉陽;吳曉寧;紀娣芳;李倩;劉蔚超;申陽;沈春鋒;滕逸龍
• 申請（專利權）人: 上海寶信軟件股份有限公司
• 主分類號: G06F8/60
• 分類號: G06F8/60;G06F8/65
• 代理公司: 上海漢聲知識產權代理有限公司 31236
• 代理人: 莊文莉

本發明提供一種基于SVG的Web組態畫面存儲與展示方法和系統，通過拖拽配置的方式搭建監控畫面，將監控畫面對應的畫面元素內容生成XML格式文件，生成畫面腳本，將XML格式文件、畫面腳本保存并發送至后臺服務；后臺服務接收XML格式文件、畫面腳本，將XML格式文件、畫面腳本轉換為能夠在瀏覽器中運行的HTML頁面；畫面運行態加載監控畫面，在瀏覽器中渲染畫面元素，向后臺服務進行監控畫面的注冊、監控畫面的數據刷新，響應用戶交互事件，對畫面元素進行刷新。實現瀏覽器環境下的工業監控HMI軟件，提高企業生產效率，降低企業在實施工業監控項目中的成本，最終為企業管理層提供直觀、全面、準確的決策依據。

技術領域

本發明涉及工業監控領域，具體地，涉及一種基于SVG的Web組態畫面存儲與展示系統和方法及介質。

背景技術

在傳統的SCADA系統中，HMI部分都是以CS模式進行部署和開發，但是隨著BS應用和移動應用等的不斷普及，傳統的HMI軟件也在向Web端遷移。隨著Web相關技術最近幾年非常迅速的發展，HTML5、Javascript、CSS3以及WebGL等相關標準也在不斷完善，其中SVG技術使得可以在瀏覽器引擎中展現矢量圖形，并且能夠以對象模型的形式來組織畫面中的各種元素。基于Web技術的HMI系統使用非常方便，可以說隨時隨地能夠對用戶所關心的資產進行監控，提供給管理層決策依據，對于企業來說能夠真正提升生產效率，大幅降低成本。

Web?HMI系統無需在客戶端安裝任何軟件或插件，用戶通過無處不在的瀏覽器端便可以直接使用，同時可以無縫擴展到移動端；Web?HMI系統能夠實現跨平臺部署，可以在Windows、Linux和iOS、Android等系統中運行；Web?HMI系統能夠很方便的實現集中管理，通過頁面間的鏈接與嵌入可以和已有的各種信息化系統進行集成；Web?HMI系統更加易于使用，對于眾多需要在工程現場進行項目實施的企業來說，基于瀏覽器的HMI系統更易于上手，能非常大程度降低對實施人員的培訓成本。

專利文獻CN108509192A公開了一種基于組態軟件SVG發布服務的Web顯示方法，在組態軟件原有圖形引擎的基礎上將原先的圖形界面轉換為SVG格式并發布到SVG發布服務器上，瀏覽器從SVG發布服務器上下載SVG圖形文件和相應腳本，在Web瀏覽器中進行展示，用戶在Web瀏覽器中與圖形的人機交互將由JavaScript腳本實現。該方法可以為降低Web程序開發的工作量，圖形數據定義比較簡單，只需在組態軟件中進行定義即可，工作量相對較少，擴展了Web端的使用范圍。但是上述專利文獻無法讓用戶直接在瀏覽器環境中通過拖拽方式制作組態畫面，編寫事件響應腳本以及對圖形元素進行關聯點操作；并且也沒有說明，如何在組態軟件將畫面轉換為SVG格式的圖形表示，因為每個組態軟件定義的格式都不相同，所述轉換過程將會非常復雜，如果處理不好，很容易出現畫面不一致的情況。

專利文獻CN108089857A公開了一種工業web實時監測頁面的生成方法，所述生成方法包括：增加用于生成web頁面的對應輸入接口；在組態系統生成組態頁面的同時，自動獲取相關組態圖元；根據組態圖元的類別，將其轉換為對應的SVG圖元；獲取與SVG圖元關聯的變量名稱，通過webSocket協議接口獲取實時數據；通過SVG事件的關聯響應,采用javascript腳本進行數據調用；定義SVG的事件，在事件函數中定時調用實時數據，并賦值給對應的SVG圖元顯示；重復上述步驟，即可完成整個工程的web頁面生成?？捎行Ы鉀Q采用傳統ActiveX控件嵌入方式發布的代碼重復編寫、瀏覽器不兼容、系統不安全等諸多問題。但是上述專利文獻仍然需要在C/S客戶端軟件中制作組態畫面，無法通過拖拽配置的方式直接在瀏覽器中搭建組態畫面。只是應用了SVG標準中的各種圖形展示，并不能有效擴充其他展示形態，比如趨勢曲線控件、視頻展示控件和實時報警列表控件等。

發明內容

針對現有技術中的缺陷，本發明的目的是提供一種基于SVG的Web組態畫面存儲與展示系統和方法及介質。

根據本發明提供的一種基于SVG的Web組態畫面存儲與展示系統，包括畫面設計器模塊、后臺服務模塊、畫面運行態模塊；