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

【參考文獻(xiàn)】

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

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

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

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

4 康保軍;;基于TWaver的電信網(wǎng)絡(luò)拓?fù)鋱D實(shí)現(xiàn)方案研究[J];軟件導(dǎo)刊;2014年10期

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

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

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

8 谷偉;;基于HTML5 Canvas的客戶(hù)端圖表技術(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實(shí)現(xiàn)智能手機(jī)跨平臺(tái)應(yīng)用開(kāi)發(fā)[J];軟件導(dǎo)刊;2013年02期

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

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

本文編號(hào)：2743198