【摘要】：市面上繪制網(wǎng)絡拓撲圖的軟件很多,比如Visio,億圖等,通過這些圖形繪制軟件可以很方便的繪制各種專業(yè)的業(yè)務流程圖、工程管理圖、網(wǎng)絡拓撲圖等。但是上述軟件均是基于C/S結(jié)構(gòu)的軟件,具有升級難,擴展性差等特點。基于Web的圖形繪制軟件主要有三種技術(shù):flash,HTML5 Canvas,SilverLight技術(shù)。其中flash,SilverLight需要安裝插件,已經(jīng)逐漸被市場淘汰。在HTML5出來之前,Web客戶端是通過SVG技術(shù)完成繪圖的,但是這種技術(shù)無法滿足復雜繪圖的需求。HTML5是新一代HTML標準,提供了Canvas標簽和一系列的JavaScript腳本API來實現(xiàn)繪圖功能。當前市場上基于HTML5技術(shù)的數(shù)據(jù)可視化的組件主要以圖表組件居多,但是拓撲圖、流程圖組件很少。使用HTML5中Canvas技術(shù),將拓撲結(jié)構(gòu)圖用JSON格式表示,開發(fā)出一套標準的拓撲圖繪圖引擎,通過配置JSON數(shù)據(jù),就可以產(chǎn)生一組拓撲圖,開發(fā)人員不需編寫繁雜的圖形編程,提高代碼重用率,從而大大提高軟件開發(fā)速度,具有一定的實際價值。本文從研究Web拓撲圖繪制的功能需求出發(fā),,提出了采用HTML5 Canvas技術(shù)進行研發(fā)系統(tǒng),主要做了如下工作:(1)論文在對拓撲圖繪制引擎的需求分析基礎(chǔ)上,確定采用HTML5 Canvas編程技術(shù)和JavaScript面向?qū)ο蠹夹g(shù)進行開發(fā),設(shè)計出系統(tǒng)架構(gòu)。(2)認真分析拓撲關(guān)系圖的對象體系,設(shè)計出拓撲圖繪制的業(yè)務對象,并給出了類圖。設(shè)計了繪圖程序的數(shù)據(jù)結(jié)構(gòu),定義了繪圖程序的JSON數(shù)據(jù)。(3)根據(jù)繪圖程序的特點,使用了單例模式、工廠模式、命令模式、狀態(tài)模式、觀察者模式等多種面向?qū)ο笤O(shè)計模式,降低了程序的復雜性。(4)完成了與服務器端的數(shù)據(jù)接口設(shè)計,數(shù)據(jù)格式采用了JSON格式,通過該AJAX技術(shù)訪問Web服務器,符合SOA體系結(jié)構(gòu)。(5)同時經(jīng)過精心的編碼過程,完成了基于HTML5的拓撲圖繪制引擎系統(tǒng)的開發(fā)與實現(xiàn),并將該繪圖引擎用于某公司的實際項目。(6)對系統(tǒng)進行了相應測試工作,測試的結(jié)果表明,系統(tǒng)運行可靠,可擴展性強,與公司的業(yè)務數(shù)據(jù)做到了無縫對接,達到了設(shè)計預期。
【學位授予單位】：南昌航空大學
【學位級別】：碩士
【學位授予年份】：2017
【分類號】：TP311.52

【參考文獻】

相關(guān)期刊論文 前10條

1 蘆文峰;王凱;吳亞非;竇長旭;;圖形繪制引擎的效率和跨平臺研究[J];計算機工程與設(shè)計;2016年05期

2 杜一;郭旦懷;陳昕;任磊;戴國忠;;一種模型驅(qū)動的可視化生成系統(tǒng)[J];軟件學報;2016年05期

3 榮艷冬;馮建平;高云勝;;基于HTML5的可視化實時數(shù)據(jù)監(jiān)控系統(tǒng)設(shè)計與實現(xiàn)[J];電腦編程技巧與維護;2015年20期

4 康保軍;;基于TWaver的電信網(wǎng)絡拓撲圖實現(xiàn)方案研究[J];軟件導刊;2014年10期

5 龔麗;;HTML5中的Canvas繪圖研究[J];軟件導刊;2014年04期

6 傅軍;;基于SVG的Web繪圖軟件設(shè)計與實現(xiàn)[J];電腦編程技巧與維護;2014年04期

7 平淑文;潘玨羽;張學金;杜曉榮;;基于HTML5和JavaScript輕量型動畫框架開發(fā)[J];計算機技術(shù)與發(fā)展;2013年12期

8 谷偉;;基于HTML5 Canvas的客戶端圖表技術(shù)研究[J];信息技術(shù);2013年09期

9 Shibo HAO;Xuefang ZHU;Guang ZHU;Gang LI;;A comparative study of information visualization from the perspective of intellectual base: Using WoS and CSSCI[J];Chinese Journal of Library and Information Science;2013年02期

10 武佳佳;王建忠;;基于HTML5實現(xiàn)智能手機跨平臺應用開發(fā)[J];軟件導刊;2013年02期

相關(guān)碩士學位論文 前1條

1 吳遜;Web下的可控圖形組件設(shè)計平臺[D];重慶大學;2015年

本文編號：2743198