EMSV1.20 能源管理系統(tǒng)組態(tài)圖形軟件 概要設(shè)計說明書 V1.00

PAGE組態(tài)圖形軟件概要設(shè)計說明書文件編號生效日期受控編號保密級別一級版本號V1.00修改次數(shù)0總頁數(shù)正文附錄無編制季建新審核批準(zhǔn)(版權(quán)所有,翻版必究)評審記錄對《組態(tài)圖形軟件概要設(shè)計說明書V1.00》的評審意見：上述問題修改驗證后，由驗證后，本文件即可發(fā)布。評審人員簽字：問題修改驗證結(jié)果：驗證人簽字：時間：年月日變更日志編號版本修改內(nèi)容修改人修改日期1V1.00定稿。季建新2014-09-15目錄TOC\o"2-3"\h\z\t"標(biāo)題1,1"154831引言 127491.1編寫目的 1194931.2背景 1138451.3定義 155631.4參考資料 1262672總體設(shè)計 230572.1需求規(guī)定 2239962.1.1功能邊界 2178952.1.2性能邊界 2194422.1.3鼠標(biāo)左右鍵功能的匯總 2144942.1.4功能清單 21763圖元提供默認圖元庫 327941圖形管理 4239032.2運行環(huán)境 484792.2.1、軟件要求 4246452.3界面設(shè)計 4277962.4功能模塊劃分 5285682.4.1圖形繪制模塊（draw） 579762.4.2圖形瀏覽（view） 554582.4.3提供js調(diào)用接口 5225752.5軟件流程圖 5173352.6配置文件與圖形文件 6143902.6.1配置文件 6315282.6.2圖形文件 6163732.7軟件開發(fā)框架 7153173組態(tài)軟件功能設(shè)計 7204313.1通用編輯功能 724953.1.1功能描述 751913.1.2基本繪圖工具 7158353.1.3樣式工具 8202353.1.4元素操作工具 9300513.2圖元功能 12106413.2.1功能描述 12144853.2.2圖元庫 12259393.2.3圖元編輯 13318483.2.4圖元特殊功能錨點 1479803.3圖形管理功能 16325203.3.1功能描述 16180253.3.2圖形初始化流程 17156413.3.3頁面集管理 18116513.3.4頁面管理 18281663.3.5圖層管理 1924723.3.5元素管理 20102253.4數(shù)據(jù)關(guān)聯(lián) 2180533.4.1功能描述 2140953.4.2操作流程 2237263.4.3需要的webservice接口 24251023.5實時監(jiān)測 25314833.5.1功能描述 25130823.4.3需要的webservice接口 2626793.4.3需要的js接口 26112343.4.4對js提供的接口 26EMS1.2B/S組態(tài)軟件概要設(shè)計說明書V1.00PAGE11引言1.1編寫目的本文檔是對天溯B/S組態(tài)繪圖軟件V1.0功能需求的詳細闡述。通過本說明書，可以了解到本軟件的開發(fā)背景、建設(shè)要求、功能需求等。該文檔羅列的功能需求以C/S繪圖軟件為參照，兼顧現(xiàn)有項目需求整合而成，開發(fā)人員開發(fā)時可依據(jù)此文檔完成各個功能的開發(fā)。本文檔面向的讀者是：EMS1.2項目組相關(guān)人員。1.2背景目前在NTS-9000系統(tǒng)中，已存在一套基于C/S架構(gòu)模式的繪圖軟件。但為了解決方便客戶在瀏覽器中直接瀏覽各監(jiān)測圖形的需求，欲將目前C/S模式升級為B/S模式，升級后繪圖部分仍采用C/S模式，實時監(jiān)測部分采用B/S模式。1.3定義下表列出本報告中專門術(shù)語的定義、英文縮寫詞的原詞組和意義、項目組內(nèi)達成一致意見的專用詞匯，同時繼承全部的先前過程中定義過的詞匯。詞匯名稱詞匯含義備注元素指繪圖過程中添加到畫布中的各種對象ROOT軟件安裝目錄1.4參考資料編號資料名稱說明1圖形系統(tǒng)需求規(guī)格說明書2原版C/S（TS-DRAW,TS-VIEW）繪圖軟件2總體設(shè)計2.1需求規(guī)定2.1.1功能邊界（1）詳細闡述軟件功能；（2）向webservice發(fā)送命令并接受返回信息處理；（3）提供軟件內(nèi)部接口，提高軟件代碼的重用性與可擴展性；（4）提供公共接口，給js頁面調(diào)用。2.1.2性能邊界（1）間隔2-5S從webservice端刷新一次數(shù)據(jù)，并能夠正確接收及處理。該時間可依據(jù)實際情況可配置；2.1.3鼠標(biāo)左右鍵功能的匯總有些功能只針對個別類型的元素；Draw中：左鍵頁面空白處--清空元素選中，開始繪制圖形左鍵元素--選中元素右鍵頁面空白處--粘貼功能菜單右鍵元素--數(shù)據(jù)關(guān)聯(lián)菜單，定義左鍵單擊動作菜單左鍵雙擊元素--打開元素設(shè)置（如表格）左鍵雙擊頁面空白--關(guān)閉繪圖模式View中：左鍵元素--執(zhí)行draw中賦予的左鍵單擊動作雙擊元素--打開詳細參數(shù)窗口2.1.4功能清單序號名稱說明1通用編輯功能基本繪圖工具直線、水平線、垂直線、矩形、圓角矩形，折線、多邊形、文字、動態(tài)文字（測點）、圖片、橢圓、圓、扇形、圓弧、弦、貝塞爾曲線，連接線，母線，圖表（柱圖，線狀圖，餅圖），表格（雙擊支持更改行數(shù)和列數(shù)，行高和列寬）；樣式工具透明度線形支持實線、虛線、點劃線；線寬（邊框）可調(diào)；填充屬性支持不填充、純色填充，漸變填充（支持線性和中心擴散漸變）；文字支持字體、字號、加粗、斜體、下劃線、靠左、靠右、居中元素操作工具點選（注意像素極小時難以選中處理）和框選；shift鍵加選和反選復(fù)制，粘貼（款圖形操作），剪切，刪除；上下左右對齊（不可選基準(zhǔn)元素，默認極值的那個）；旋轉(zhuǎn)（不支持文字），平移（支持鍵盤微調(diào)），縮放置頂置底全圖放大、縮小、還原，等比例滿屏（1:1）鷹眼網(wǎng)格定義左鍵單擊動作（動作目前只提供打開其他頁面的動作）2圖元編輯圖元管理支持自定義圖元一級分類功能，圖元的重命名，刪除和編輯圖元新建圖元新建支持輸入圖元名稱、圖元狀態(tài)定義，默認提供值為0的狀態(tài)，可繼續(xù)添加狀態(tài)，狀態(tài)值可定義，新建狀態(tài)下的元素與默認狀態(tài)相同，可編輯；添加的狀態(tài)可刪除，默認狀態(tài)不能刪除；圖元新建時可選擇圖元所屬的分類；圖元保存圖元保存在單獨文件當(dāng)中，并賦予唯一id與版本號概念圖元特殊功能圖元支持定義錨點圖元提供默認圖元庫默認圖元主要集成了特定系統(tǒng)中定制的一些特殊功能的圖元（如各種儀表）3圖形編輯圖形管理圖形中分頁面集-頁面-圖層-元素的概念，一個頁面集包含多個頁面，一個頁面包含多個圖層，圖層中添加各種元素；頁面，圖層都支持新建，重命名，刪除，重新編輯操作；圖層還支持隱藏/顯示，激活，z軸操作；添加到圖層中的元素支持更改當(dāng)前所屬圖層；軟件啟動時默認打開頁面可設(shè)置；頁面尺寸，背景可調(diào)整；圖形保存圖形中頁面集，頁面都用單獨文件保存，并賦予唯一id4數(shù)據(jù)關(guān)聯(lián)有按鍵提供查看當(dāng)前哪些元素未進行數(shù)據(jù)關(guān)聯(lián)；右鍵菜單提供數(shù)據(jù)關(guān)聯(lián)選項，可進行數(shù)據(jù)關(guān)聯(lián)，也可查看數(shù)據(jù)關(guān)聯(lián)信息；提供測點關(guān)聯(lián)和對象關(guān)聯(lián)（即批量測點關(guān)聯(lián)）兩種模式；關(guān)聯(lián)攝像頭對象時，點擊可播放視屏；數(shù)據(jù)關(guān)聯(lián)信息單獨文件保存；5圖形瀏覽提供默認隱藏的頁面樹，可通過小圖標(biāo)調(diào)入/調(diào)出定時刷新已關(guān)聯(lián)元素的數(shù)據(jù)支持鷹眼導(dǎo)航支持告警閃爍2.2運行環(huán)境2.2.1、軟件要求客戶機瀏覽器：Chrome、Firefox、≥IE10瀏覽器支持flashplayerFlashplayer10以上AdobeAIRInstaller客戶機需安裝AdobeAIRInstaller2.3界面設(shè)計 軟件界面采用扁平化設(shè)計風(fēng)格，暗色系色調(diào)為主。布局模擬現(xiàn)下流行p圖軟件ps的布局結(jié)構(gòu)。整個界面操作方式包含了拖拽，單機，右擊等操作手法；2.4功能模塊劃分2.4.1圖形繪制模塊（draw）該模塊主要提供圖形繪制功能，包含了通用的編輯功能，圖元編輯功能，圖形編輯功能，數(shù)據(jù)關(guān)聯(lián)功能。2.4.2圖形瀏覽（view）主要是實時監(jiān)測數(shù)據(jù)，主要包含實時刷新數(shù)據(jù)和報警提示；2.4.3提供js調(diào)用接口接口描述接口定義打開區(qū)域圖形openAreaPage(areaId:Number)2.5軟件流程圖刷新刷新2.6配置文件與圖形文件所有文件都存放于軟件安裝目錄下，安裝目錄以下統(tǒng)一用root表示；2.6.1配置文件圖形軟件的配置文件（root/assets/xml/config.xml）：關(guān)于整個軟件的一些配置軟件打開時需要打開的工程的配置<proj>工程名稱</proj>；數(shù)據(jù)關(guān)聯(lián)時webservice地址配置：<webS>地址url</webS>；圖形瀏覽時告警閃爍顏色配置：<warnstatusValue=”告警狀態(tài)值”color=”告警顏色（16進制：#ffffff）”type=“狀態(tài)類型”/>；數(shù)據(jù)刷新時間配置<refreshDataTime>刷新時間<refreshDataTime>告警刷新時間配置<refreshWarnTime>刷新時間<refreshWarnTime>2.數(shù)據(jù)范圍配置文件(root/assets/xml/dataRange.xml):用于數(shù)據(jù)關(guān)聯(lián)時數(shù)據(jù)范圍的配置，一般情況下不做更改；2.6.2圖形文件頁面集文件夾(Root/assets/graphics/工程名稱/頁面集UID)：每新建一個頁面集會為該頁面集新建一個以該頁面集UID命名的文件夾用于存放所有該頁面集的相關(guān)文件；頁面集用作給頁面分類，類似圖元與圖元庫的概念；頁面集文件（Root/assets/graphics/工程名稱/頁面集UID/頁面集UID.xml）：所建頁面集的信息頁面文件夾（Root/assets/graphics/工程名稱/頁面集UID/pages）:參照1中所述，還會在頁面集文件夾下創(chuàng)建一個頁面文件夾用于存放該頁面集下的頁面文件；頁面文件（Root/assets/graphics/工程名稱/頁面集UID/pages/頁面UID.xml）：頁面集中每有一個頁面，該頁面便會在pages目錄下有一個單獨的文件表示；圖片文件（Root/assets/graphics/工程名稱/image/imageUID.jpg）:用于存放頁面所引用的圖片，位于本地的圖片可以通過上傳圖片功能上傳到該目錄下供頁面引用；圖元文件（Root/assets/graphics/pel/圖元庫UID.xml）：圖元按照圖元庫進行分類，每個圖元庫由一個以自己UID命名的xml文件表示。數(shù)據(jù)關(guān)聯(lián)文件（Root/assets/graphics/工程名稱/頁面集UID/dataLink/dataLinkUID.xml）：每個頁面對應(yīng)一個數(shù)據(jù)關(guān)聯(lián)文件，以dataLinkUID映射；注：工程人員在繪圖完成后需把整個graphics文件夾拷貝到服務(wù)器指定目錄覆蓋原來的graphics目錄；2.7軟件開發(fā)框架采用輕量級的PUREMVC框架，代碼模塊分為m,v,c三層結(jié)構(gòu)，模塊間信息傳遞以消息發(fā)送/接受的形式進行；3組態(tài)軟件功能設(shè)計3.1通用編輯功能3.1.1功能描述 通用編輯功能包含了一些基本繪圖工具，元素樣式調(diào)整工具，元素操作工具；3.1.2基本繪圖工具基本繪圖工具包含：選擇、直線、水平線、垂直線、矩形、圓角矩形，折線、多邊形、文字、動態(tài)文字（測點）、圖片、橢圓、圓、扇形、圓弧、貝塞爾曲線，連接線，母線，圖表（柱圖，線狀圖，餅圖），表格（雙擊支持更改行數(shù)和列數(shù)，行高和列寬）；3.1.2.1工具描述·所有元素都支持縮放和平移（平移支持鍵盤微調(diào)）操作·矩形，圓角矩形，折線，多邊形，圖片，圓，橢圓，扇形，圓弧，貝塞爾曲線支持旋轉(zhuǎn)；·圓角矩形支持圓角調(diào)整；·折線，多變形支持基準(zhǔn)點的調(diào)整·繪圖工具的操作方式分三種：1.選擇、直線、水平線、垂直線、矩形、圓角矩形、橢圓、圓、扇形、圓弧、弦，連接線，母線、表格繪制時操作方式一致；2.折線、多邊形、貝塞爾曲線操作方式一致；3.文字，動態(tài)文字，圖片，圖表操作方式一致（與圖元操作方式一致）；3.1.2.2操作流程以上1和2的操作流程：3.1.3樣式工具3.1.3.1工具描述·所有元素支持透明度·線形支持實線、虛線、點劃線；·線形，閉合圖形支持線寬（邊框）可調(diào)；·閉合圖形填充屬性支持不填充、純色填充，漸變填充（支持線性和中心擴散漸變）；·文字支持字體、字號、加粗（ctrl+b）、斜體（ctrl+i）、下劃線（ctrl+u）、靠左（ctrl+l）、靠右（ctrl+r）、居中（ctrl+e）·樣式工具欄默認全部可用，當(dāng)選擇某種元素時僅該元素支持的樣式可用，其余灰度處理；·樣式工具欄的樣式工具值與當(dāng)前所選元素同步，未選或多選時顯示默認值；3.1.3.2操作流程3.1.4元素操作工具3.1.4.1工具描述·點選：線性元素像素小于4像素時，默認可選中范圍為4像素；·框選：在繪圖模式關(guān)閉的情況下，鼠標(biāo)按下空白處移動鼠標(biāo)，繪制虛線選框，元素全部在虛線范圍內(nèi)的判斷為選中；·圖素的組合：選中若干圖形元素進行組合操作，組合后若干元素作為一個元素處理。如下圖：·shfit鍵加選，反選：shift下，點選元素可以加/減選該元素，框選時只可加選；·復(fù)制（ctrl+c），粘貼（ctrl+v），剪切（ctrl+x）,刪除（delete）不在頁面中提供按鈕操作，提供快捷鍵；同時粘貼提供右鍵菜單功能，快捷鍵粘貼到左上角，右鍵菜單粘貼到鼠標(biāo)位置；·上下左右對齊：在選2個元素以上的情況下，對齊方式以最上，最下，最左，最右的一條邊對齊；·平移（支持鍵盤微調(diào)），縮放支持所有元素·旋轉(zhuǎn)支持矩形，圓角矩形，折線，多邊形，圖片，圓，橢圓，扇形，圓弧，貝塞爾曲線和圖元；旋轉(zhuǎn)的中心點為圖形的中心店；·置頂（ctrl+f）/置底（ctrl+d）：在當(dāng)前層的所有元素中置頂或置底；·全圖放大、縮小、還原，等比例滿屏（1:1）：放大縮小極限為10倍，等比例滿屏（1:1）不超過該值·鷹眼縮略圖要同步當(dāng)前頁面·網(wǎng)格可選顯示/隱藏·給元素定義左鍵單擊動作：打開另一個頁面，動作信息單獨文件保存3.1.4.2操作流程框選：復(fù)制，粘貼，剪切：定義左鍵單擊動作：3.2圖元功能3.2.1功能描述圖元是集成了某些特定功能或圖形組合的固定組件，可以方便工程人員繪制各種系統(tǒng)圖；圖元包含了圖元庫和圖元2個概念，圖元庫是圖元的分類。3.2.2圖元庫3.2.2.1功能描述·提供默認圖元庫，默認圖元庫中主要集成了特定系統(tǒng)中定制的一些特殊功能的圖元（如各種儀表）。默認圖元庫中包含：區(qū)域（表示某個區(qū)域，繪制方式和多邊形類似），LED開關(guān)，場景按鈕，窗簾，風(fēng)機·在draw中某些默認圖元提供數(shù)據(jù)以對象關(guān)聯(lián)方式進行；在view中這些圖元提供左鍵雙擊打開詳細參數(shù)窗口。·圖元庫支持新建和刪除兩項操作（默認圖元庫不支持）·每個圖元庫以單獨xml文件存儲·圖元庫新建，刪除（操作圖標(biāo)至于標(biāo)題欄上），圖元庫刪除操作可能會導(dǎo)致圖形中引用了該庫中圖元的元素不可用，次操作前必須提示3.2.2.2操作流程3.2.3圖元編輯3.2.3.1功能描述·圖元編輯是對圖元的一系列操作，圖元支持圖元新建，修改，刪除，保存，以及對圖元狀態(tài)的編輯；圖元狀態(tài)也支持新建，修改，刪除操作；圖元刪除操作可能會導(dǎo)致圖形中引用了該圖元的元素不可用，此操作前必須提示·圖元默認提供值為0的圖元狀態(tài)，可繼續(xù)添加狀態(tài)，狀態(tài)值可定義，新建狀態(tài)下的元素與默認狀態(tài)相同，可編輯；添加的狀態(tài)可刪除，默認狀態(tài)不能刪除；·圖元新建時可選擇圖元所屬的圖元庫；·圖元狀態(tài)由基本繪圖工具繪制而來；·圖元數(shù)據(jù)信息保存到所屬圖元庫的xml文件中，每次新建，修改，刪除圖元時都需重寫圖元庫的xml文件?！D元保存時圖元數(shù)據(jù)中需記錄生成此圖元文件的程序版本號。圖形元素的數(shù)據(jù)格式不是永遠不變的，圖形格式發(fā)生變化時，要能根據(jù)程序版本號，由獨立的圖形格式升級程序，自動升級成新版本的圖元文件。自動升級工具本期不提供。每個圖元應(yīng)該有一個自己的版本號，初次創(chuàng)建時版本號為1，每次修改圖元，其版本號自動加1。3.2.3.2操作流程3.2.4圖元特殊功能錨點3.2.4.1功能描述·錨點的意義：在電氣圖中有很多的電氣設(shè)備連接圖，上面的圖元之間要通過連接線連接起來。錨點就是連接線在圖元上的附著點。錨點是整個圖元共用的，不管圖元有多少狀態(tài)圖，但錨點位置和個數(shù)都是一致的。下圖所示是在圖形編輯中一個連接線連接了2個開關(guān)。當(dāng)手車開關(guān)移動時，連接線自動跟隨?！ゅ^點在圖元新建時默認提供上下左右邊的中點共4個，錨點可自行調(diào)整位置和增刪，錨點與圖元狀態(tài)無關(guān)。且只能在默認狀態(tài)（即狀態(tài)1）下才可編輯錨點；·錨點的編輯需通過新建圖元或修改圖元功能進入圖元編輯窗口才能編輯錨點；3.2.4.2操作流程3.3圖形管理功能3.3.1功能描述·圖形中分葉面集-頁面-圖層-元素的概念，一個葉面集包含多個頁面，一個頁面包含多個圖層，圖層包含多個元素；·頁面是用來在其中繪制各類系統(tǒng)監(jiān)測圖的，圖層是給監(jiān)測圖的基本圖素（直線、矩形等），圖元、圖表（棒圖、餅圖、曲線）、遙測文字、專業(yè)工具（母線、連接線）、表格、視頻窗口等分層排列顯示用的，是元素的容器·圖形列表展示時頁面集合頁面以樹的形式展示，樹下方提供新建和刪除頁面功能按鈕；圖層自成一樹，顯示的是當(dāng)前打開頁面的圖層，樹下方提供新建和刪除圖層按鈕，每項之前提供顯隱、激活圖層按鈕；其他操作以右鍵菜單形式提供；·對于圖形所做的各種操作必須在保存之后才生效，才會寫入文件，不保存關(guān)閉軟件所有在上一次保存之后的操作將不做保存；·繪圖軟件打開時，加載配置工程下的全部頁面集和其下的頁面，圖層，并打開默認打開的頁面；·配置的工程名不存在時新建該工程目錄·工程目錄中包含了其下的頁面集文件夾和圖片文件夾，頁面集文件夾以頁面集對象的UID命名，頁面集文件夾中包含頁面集xml，頁面文件夾；頁面集xml仍以頁面集對象UID命名，其中包含頁面集名稱，頁面等信息，頁面信息以頁面的UID映射；·圖片文件夾中的圖片也是以圖片UID命名,通過上傳功能可以講本地圖片上傳到該文件夾下，然后被頁面元素引用?！ろ撁嫖募A中是以頁面UID命名的表示頁面的xml文件，其中包含頁面名稱，圖層，元素等信息，圖片元素的source屬性直接指向圖片的相對路勁；·所有文件的路徑在2.6中以列出3.3.2圖形初始化流程3.3.3頁面集管理3.3.3.1功能描述·頁面集支持新建，刪除，重命名操作·刪除頁面集時連帶其下頁面，圖層，元素一起刪除；3.3.3.2操作流程3.3.4頁面管理3.3.4.1功能描述·頁面支持新建，刪除，重命名，打開操作，頁面背景色，大小可調(diào)整·刪除頁面時連帶其下圖層，元素一起刪除；3.3.4.2操作流程3.3.5圖層管理3.3.5.1功能描述·圖層支持新建，刪除，重命名，顯隱，激活，Z軸操作·刪除頁面時連帶其下圖層，元素一起刪除；3.3.5.2操作流程3.3.5元素管理3.3.5.1功能描述·元素支持添加，刪除，更改所屬圖層操作·更改所屬圖層只限于在當(dāng)前頁面的所有圖層中選擇·刪除操作只支持快捷鍵（delete）·刪除圖片元素時腰間刪除圖片的UID臨時存儲在一個集合中，再做保存時將image下對應(yīng)的圖片刪除，刪除后清空集合；·保存時到保存圖片環(huán)節(jié)時，根據(jù)圖片UID判斷image目錄下是否已存在該圖片，避免重復(fù)覆蓋寫入；·添加的圖元以圖元UID形式映射到圖元庫xml文件中的對應(yīng)圖元數(shù)據(jù)·添加的圖片以單獨文件形式保存到image目錄下，在元素中以圖片UID形式映射3.3.5.2操作流程3.4數(shù)據(jù)關(guān)聯(lián)3.4.1功能描述·并不是所有元素都可以進行數(shù)據(jù)關(guān)聯(lián)，只有特定的（在程序中實現(xiàn)IDataLink接口的元素）元素可以數(shù)據(jù)關(guān)聯(lián)；·可以數(shù)據(jù)關(guān)聯(lián)的元素右鍵菜單有數(shù)據(jù)關(guān)聯(lián)選項；·數(shù)據(jù)關(guān)聯(lián)可以只關(guān)聯(lián)一個數(shù)據(jù)點，也可以以整臺對象的多個參數(shù)一次性關(guān)聯(lián)；根據(jù)元素是否是對象而定；·每個頁面中元素的數(shù)據(jù)關(guān)聯(lián)的信息以一個單獨文件保存，并以uid映射·有按鍵提供查看當(dāng)前哪些元素可進行關(guān)聯(lián)而未關(guān)聯(lián)；·關(guān)聯(lián)攝像頭對象時，點擊可播放視屏；播放窗口使用瀏覽器彈出（由于該技術(shù)尚不熟悉，可能后期實現(xiàn)方式有所改動）·頁面可以關(guān)聯(lián)區(qū)域樹·區(qū)域關(guān)聯(lián)（區(qū)域告警用）3.4.2操作流程·頁面關(guān)聯(lián)所提供區(qū)域樹為懶加載·數(shù)據(jù)點的關(guān)聯(lián)與原有的draw操作方式相同3.4.3需要的webservice接口·頁面關(guān)聯(lián)獲取區(qū)域樹接口提供的webservice接口名稱參數(shù)返回值功能描述ser-GetAreaTreeByParentIdPare