[發明專利]一種基于SVG技術的實時監測工業數據的方法

在審

• 申請號: 202010544747.9
• 申請日: 2020-06-15
• 公開（公告）號: CN111880892A
• 公開（公告）日: 2020-11-03
• 發明（設計）人: 周林華;張豪;郭敏;張紀煒;夏曦;羅漢杰
• 申請（專利權）人: 中冶南方都市環保工程技術股份有限公司
• 主分類號: G06F9/455
• 分類號: G06F9/455;G06F9/451;G06F8/76
• 代理公司: 北京匯澤知識產權代理有限公司 11228
• 代理人: 鄭飛

一種基于SVG技術的實時監測工業數據的方法，包括：利用SVG繪圖軟件繪制工藝流程監測畫面，編寫監測畫面相應的自定義js腳本，將SVG圖形文件與自定義JS腳本文件進行關聯；前端發起網絡請求，加載SVG圖形文件，將自定義js腳本加入到網頁中；通過js腳本建立頁面對象，根據SVG圖形文件內容在頁面對象中添加元素對象，建立元素對象的結構后，向后臺請求數據，給元素對象相應屬性賦值，完成頁面數據顯示；定期向后臺請求實時數據，刷新頁面觀測點值后運行自定義js腳本，執行用戶需求的邏輯動作。本發明采用SVG圖形技術，解決了現有技術圖形格式不通用，畫面數據不開放，無法轉換復用的問題。并且js封裝腳本可以內嵌H5網頁形式運行，無需下載瀏覽器控件/插件。

技術領域

本發明屬于工業生產智能制造技術領域，特別是一種基于SVG技術的實時監測工業數據的方法。

背景技術

現有的遠程實時在線監測系統普遍采用的是B/S架構，客戶端為網頁瀏覽器，提供給用戶較大的靈活性與開放性，也便于系統的擴展、維護以及管理。其中實時畫面監測目前主要采用ActiveX控件或JavaApplet技術兩種方式來實現，通過瀏覽器下載、安裝運行ActiveX控件/Applet的方式，來實現畫面的展示以及數據動態變化效果。其優點在于ActiveX控件/Applet是以二進制方式在瀏覽器中運行，效率較高。

上述實時畫面監測的技術解決方案已經能夠很好地解決遠程web端的實時監測需求，但也存在一些不足：一是圖形格式不通用，畫面數據不開放，無法轉換復用；二是由于瀏覽器的差異，下載、安裝插件常常會出現不兼容的問題；三是隨著目前移動辦公需求的增加，開發基于移動端的實時畫面監測功能已是勢在必行，而移動端開發無法基于已有的Web端瀏覽器插件。

發明內容

鑒于上述問題，本發明提供一種克服上述問題或者至少部分地解決上述問題的一種基于SVG技術的實時監測工業數據的方法。

一種基于SVG技術的實時監測工業數據的方法，包括：

S100.利用SVG繪圖軟件繪制工藝流程監測畫面，編寫監測畫面相應的自定義js腳本，將SVG圖形文件與自定義JS腳本文件進行關聯；

S200.前端發起網絡請求，加載SVG圖形文件，將自定義js腳本加入到網頁中；

S300.通過js腳本建立頁面對象，根據SVG圖形文件內容在頁面對象中添加元素對象，建立元素對象的結構后，向后臺請求數據，給元素對象相應屬性賦值，完成頁面數據顯示；

S400.定期向后臺請求實時數據，刷新頁面觀測點值后運行自定義js腳本，執行用戶需求的邏輯動作。

進一步地，S100中，通過將繪制好的SVG畫面和自定義JS腳本文件名修改一致，使SVG圖形文件與自定義JS腳本文件進行關聯。

進一步地，SVG圖形文件通過內嵌H5網頁的形式實現svg圖形畫面的顯示與縮放。

進一步地，S400中，通過計時器timer實現循環數據刷新與腳本運行。

進一步地，S300中，向后臺請求數據，采用異步請求的方式進行數據請求。

進一步地，進行封裝的js代碼使用兼容各瀏覽器引擎的公用接口，使之兼容不同系統瀏覽器。

進一步地，S400中，執行用戶需求的邏輯動作，包括對設備或觀測數據點進行顯隱、變色操作。

進一步地，點擊變色的設備或觀測數據點后，頁面會進行進行跳轉，跳轉頁面可以查看設備或觀測數據點歷史曲線、最大值、最小值、平均值以及實時值。

進一步地，js封裝腳本可在WEB端運行，也可在移動端運行。

本發明的有益效果是：