隨著現(xiàn)代社會中信息技術(shù)的高速發(fā)展,數(shù)據(jù)可視化已成為數(shù)據(jù)分析領(lǐng)域非常重要的技術(shù)之一。各種類型的圖表是數(shù)據(jù)可視化的重要工具,由多種圖表組成的大屏能夠幫助人們非常直觀簡潔地分析數(shù)據(jù)。本文中所指的大屏,就是一種數(shù)據(jù)可視化的綜合手段,即把不同類型的數(shù)據(jù)通過多樣、適當?shù)膱D表整合到一起,形成一個完整的數(shù)據(jù)可視化界面,該界面往往被投放在各種分辨率和各種尺寸的屏幕載體上。為了生成上述的大屏頁面,用戶目前有兩類數(shù)據(jù)可視化工具可以選擇使用,一類是面向軟件技術(shù)人員的編程框架,其主要為開發(fā)者提供專業(yè)編程接口來實現(xiàn)數(shù)據(jù)可視化;二是面向普通用戶的數(shù)據(jù)可視化系統(tǒng)。但在大數(shù)據(jù)環(huán)境下,普通用戶存在面向大屏進行圖表展示的需求,所以對數(shù)據(jù)可視化工具提出了更高的要求,例如較高的性能、學習成本要低、操作要更簡便等需求。針對上述問題,本文通過對相關(guān)可視化技術(shù)和可視化系統(tǒng)現(xiàn)狀的詳細研究,基于Web設(shè)計并實現(xiàn)了一款面向大屏的圖表展示系統(tǒng),以便眾多普通用戶可以使用該系統(tǒng)輕松地去創(chuàng)建數(shù)據(jù)可視化大屏,方便簡單地完成數(shù)據(jù)分析工作。本文研究內(nèi)容及工作主要包含以下四部分:(1)基于Vue.js與Node.js設(shè)計實現(xiàn)了一種能生成多種類型圖表并最終面向大屏的通用性圖表展示系統(tǒng)。該系統(tǒng)操作友好且功能全面,具備大屏動態(tài)配置、數(shù)據(jù)源對接、大屏管理、用戶管理等功能。(2)基于ECharts可視化框架設(shè)計實現(xiàn)一種大屏動態(tài)配置功能,該功能主要包括完善的圖表渲染、友好的拖拽布局交互效果和畫布的實時更新。(3)設(shè)計實現(xiàn)多種數(shù)據(jù)源對接方式,主要分為數(shù)據(jù)庫對接、前端輸入靜態(tài)JSON數(shù)據(jù)對接、Mock數(shù)據(jù)對接和上傳本地CSV文件四種方式。(4)設(shè)計實現(xiàn)一種大屏頁面快速渲染與發(fā)布機制,并通過性能測試驗證了該機制提高了用戶所發(fā)布的大屏在瀏覽器端的加載速度。本文基于Web實現(xiàn)的面向大屏的圖表展示系統(tǒng),支持多種用戶角色使用,并具有方便的用戶管理功能。本系統(tǒng)采用前后端分離的架構(gòu),整體架構(gòu)符合組件化和模塊化的設(shè)計原則。此外,為了解決在大數(shù)據(jù)量和大量圖表情況下的數(shù)據(jù)可視化大屏在瀏覽器端渲染緩慢的問題,本系統(tǒng)從架構(gòu)層面提供了一套大屏頁面快速渲染與發(fā)布機制。該機制主要內(nèi)容分為兩個方面,一是針對數(shù)據(jù)大屏的特點定制一套可擴展的基于JSON Schema大屏頁面描述文檔,二是提供一種大屏頁面后端渲染引擎,在Node.js運行環(huán)境將大屏中的圖表以SVG模式進行后端渲染,并生成含有大屏頁面結(jié)果的HTML文檔,將大屏頁面以URL的形式進行發(fā)布。最后,本文系統(tǒng)通過了一系列的功能測試、單元測試和性能測試的驗證,符合系統(tǒng)的功能性需求和非功能性需求,具有較高的實際應用價值。
【學位單位】：西安電子科技大學
【學位級別】：碩士
【學位年份】：2019
【中圖分類】：TP393.09;TP311.13
【部分圖文】：

根據(jù)上文做出的分析，首先對系統(tǒng)的總體功能性需求進行分析和總結(jié)。此處畫出了面向大屏的圖表展示系統(tǒng)的整體用例圖，如圖 3.1 所示。圖3.1 系統(tǒng)總體用例圖本系統(tǒng)主要的功能需求包括：（1）大屏動態(tài)配置。此項功能屬于普通用戶和管理員的專屬功能，普通用戶和管理員登陸成功可以使用。本文系統(tǒng)需要提供簡便的可視化操作，面向非編程用戶提供可視化的配置操作流程。本系統(tǒng)為用戶提供數(shù)據(jù)可視化大屏的全流程配置功能，包括大屏背景、分辨率和各個數(shù)據(jù)圖表的配置功能。用戶需要系統(tǒng)提供友好的交互操作和簡潔的系統(tǒng)界面。（2）數(shù)據(jù)源配置。此項功能屬于普通用戶和管理員的專屬功能，普通用戶和管理員登陸成功可以使用。數(shù)據(jù)源是指大屏中每個圖表的數(shù)據(jù)來源，數(shù)據(jù)來源應包括：前端手動輸入、數(shù)據(jù)庫數(shù)據(jù)、Mock 數(shù)據(jù)和本地上傳文件。（3）大屏管理。該功能屬于公共功能，其中訪客用戶只有查看大屏這個子功能的使用權(quán)限。登錄成功的用戶可以使用。主要功能是對大屏進行管理并進行發(fā)布，該功能令多個用戶通過系統(tǒng)可以并行地同時配置多個大屏

3.1.3 大屏動態(tài)配置功能需求大屏動態(tài)配置是系統(tǒng)功能模塊中的核心功能，它的用例圖如圖 3.2 所示。圖3.2 大屏動態(tài)配置用例圖大屏動態(tài)配置功能主要包括：（1）新增圖表本文系統(tǒng)提供多種類型的圖表。用戶可以在配置大屏的過程中，往大屏中添加新

組件占用時，系統(tǒng)應給出相應的提示，引導用戶刪除所有占用該數(shù)據(jù)源的圖表后，該條數(shù)據(jù)源信息才可以完全被清除。圖3.3 數(shù)據(jù)源配置功能用例圖數(shù)據(jù)源配置功能的需求列表如表 3.2 所示。表3.2 數(shù)據(jù)源配置功能需求列表需求編號 需求內(nèi)容 優(yōu)先級R5 系統(tǒng)支持新增、編輯數(shù)據(jù)源 高R6 系統(tǒng)支持對接數(shù)據(jù)庫、前端手動輸入、Mock 數(shù)據(jù)和本地上傳文件多種數(shù)據(jù)源對接方式高R7 系統(tǒng)支持查看、刪除用戶創(chuàng)建的數(shù)據(jù)源 高R8 系統(tǒng)支持查看數(shù)據(jù)源時，提供數(shù)據(jù)源內(nèi)容的預覽功能 低

【相似文獻】

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

1 張開法;;混合現(xiàn)實技術(shù)在大數(shù)據(jù)可視化中的應用[J];電腦編程技巧與維護;2019年04期

2 左圓圓;王媛媛;蔣珊珊;徐榕薈;;數(shù)據(jù)可視化分析綜述[J];科技與創(chuàng)新;2019年11期

3 吳蓓;于純浩;;淺論數(shù)據(jù)可視化技術(shù)在教學中的應用[J];吉林工程技術(shù)師范學院學報;2019年06期

4 ;數(shù)據(jù)可視化：在未來實現(xiàn)挖掘數(shù)據(jù)智慧的愿景[J];今日科技;2019年08期

5 夏晗雨;;數(shù)據(jù)可視化傳播網(wǎng)絡策略研究[J];新聞研究導刊;2019年16期

6 孫敏;王琳;;大數(shù)據(jù)時代下的數(shù)據(jù)可視化方法分析[J];軟件;2019年09期

7 劉X;;勢在必行，面向決策支持的數(shù)據(jù)可視化系統(tǒng)設(shè)計[J];產(chǎn)權(quán)導刊;2019年09期

8 田偉;;基于交互式的大數(shù)據(jù)可視化探究[J];中國新通信;2019年20期

9 劉立偉;;數(shù)據(jù)可視化在新聞傳播中的連接角色[J];青年記者;2017年35期

10 郭瑋;;大數(shù)據(jù)背景下統(tǒng)計數(shù)據(jù)可視化研究[J];內(nèi)蒙古統(tǒng)計;2017年06期

相關(guān)會議論文 前10條

1 劉勘;周洞汝;;大型數(shù)據(jù)庫中的數(shù)據(jù)可視化技術(shù)[A];第十八屆全國數(shù)據(jù)庫學術(shù)會議論文集（技術(shù)報告篇）[C];2001年

2 于暉;;數(shù)據(jù)可視化:科學與藝術(shù)的融合之美[A];科學藝術(shù) 傳承創(chuàng)新—科學與藝術(shù)融合之路[C];2017年

3 管理論壇課題組;;精準數(shù)據(jù)的獲取、挖掘與利用——基于電子地圖的數(shù)據(jù)可視化分析[A];浙江省煙草學會2014年學術(shù)年會論文暨信息技術(shù)專業(yè)委員會科技成果匯編[C];2014年

4 馬辰;李瑋;高慧英;;數(shù)據(jù)可視化技術(shù)及其在船舶平臺系統(tǒng)中的應用[A];中國造船工程學會電子技術(shù)學術(shù)委員會2017年裝備技術(shù)發(fā)展論壇論文集[C];2017年

5 夏菁;劉真;胡越琦;陳為;彭帝超;;基于超圖的骨生物數(shù)據(jù)可視化研究[A];第五屆全國幾何設(shè)計與計算學術(shù)會議論文集[C];2011年

6 謝跟蹤;;生態(tài)環(huán)境空間數(shù)據(jù)可視化研究[A];全國地圖學與GIS學術(shù)會議論文集[C];2004年

7 呂媛;郭艷華;朱瑋;于薇;;基于AngularJs的數(shù)據(jù)可視化呈現(xiàn)[A];2018年數(shù)字化造船學術(shù)交流會議論文集[C];2018年

8 陳進生;羅月童;;輪廓樹及其在體數(shù)據(jù)可視化中的應用[A];全國第21屆計算機技術(shù)與應用學術(shù)會議（CACIS·2010）暨全國第2屆安全關(guān)鍵技術(shù)與應用學術(shù)會議論文集[C];2010年

9 俞勝賓;王文娟;;基于WebGIS和WebGL的氣象數(shù)據(jù)可視化模塊及其應用[A];第35屆中國氣象學會年會 S14 大數(shù)據(jù)、互聯(lián)網(wǎng)、融媒體時代氣象服務的創(chuàng)新與變革——第八屆氣象服務發(fā)展論壇[C];2018年

10 吉龍龍;張瑛秋;周星棟;朱航標;;數(shù)據(jù)可視化在乒乓球比賽中的應用研究[A];第十一屆全國體育科學大會論文摘要匯編[C];2019年

相關(guān)重要報紙文章 前10條

1 廖堡;以大數(shù)據(jù)可視化形式呈現(xiàn)雷鋒印記[N];中國新聞出版廣電報;2019年

2 佚名;工業(yè)大數(shù)據(jù)可視化難點[N];中國信息化周報;2019年

3 孫彬 劉雄 賀艷杰;數(shù)據(jù)可視化 解決小問題 逐步大發(fā)展[N];建筑時報;2019年

4 Isaac Sacolick 編譯 Charles;實現(xiàn)更智能數(shù)據(jù)可視化的5個步驟[N];計算機世界;2019年

5 本報記者 蘇潔;厲害了，人工智能![N];中國保險報;2016年

6 本報記者 劉晶晶;大數(shù)據(jù)可視化[N];中國信息化周報;2017年

7 中國煙草總公司深圳市公司財務管理處 張鴻標;財務數(shù)據(jù)可視化：讓不懂財會的人看懂企業(yè)運營[N];中國會計報;2017年

8 中國青年報·中青在線記者 蔣椺薇 蔣欣 傅曉羚;改變云計算的極客少年[N];中國青年報;2017年

9 南京大學教育學院 張金磊 等;大數(shù)據(jù)可視化觸發(fā)教育新熱點[N];中國信息化周報;2016年

10 本報記者 劉磊;數(shù)據(jù)可視化賦予企業(yè)真正的大數(shù)據(jù)認知能力[N];貴陽日報;2016年

相關(guān)博士學位論文 前10條

1 陳雷;地震數(shù)據(jù)可視化及斷層智能識別方法研究[D];北京工業(yè)大學;2017年

2 馬仁安;基于微機的三維地震數(shù)據(jù)可視化技術(shù)研究[D];南京理工大學;2004年

3 任永功;面向聚類的數(shù)據(jù)可視化方法及相關(guān)技術(shù)研究[D];東北大學;2006年

4 梁秀霞;醫(yī)學影像數(shù)據(jù)可視化中若干問題研究[D];山東大學;2006年

5 王啟超;面向體數(shù)據(jù)可視化的數(shù)據(jù)預處理方法研究[D];浙江大學;2017年

6 周璐;復雜向量場數(shù)據(jù)可視化技術(shù)研究與實現(xiàn)[D];中國人民解放軍國防科學技術(shù)大學;2000年

7 常鳳香;基于生物電阻抗測量原理的經(jīng)絡診斷數(shù)據(jù)可視化方法研究[D];燕山大學;2012年

8 華崗;地震體數(shù)據(jù)可視化與分析研究[D];浙江大學;2011年

9 雷迎科;流形學習算法及其應用研究[D];中國科學技術(shù)大學;2011年

10 劉玉華;模型驅(qū)動的網(wǎng)絡數(shù)據(jù)的可視分析方法研究[D];華東師范大學;2017年

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

1 向夢迪;數(shù)據(jù)可視化技術(shù)在H公立醫(yī)院績效審計中的應用研究[D];中國財政科學研究院;2019年

2 周文;數(shù)據(jù)可視化中視覺元素造型設(shè)計研究[D];四川師范大學;2019年

3 徐曉文;氣象時空數(shù)據(jù)可視化的研究與實現(xiàn)[D];中國電子科技集團公司電子科學研究院;2018年

4 王寧;面向大屏的圖表展示系統(tǒng)設(shè)計與實現(xiàn)[D];西安電子科技大學;2019年

5 施皓;面向布局推薦的數(shù)據(jù)可視化系統(tǒng)設(shè)計與實現(xiàn)[D];西安電子科技大學;2019年

6 戴鵬;城市車輛數(shù)據(jù)可視化系統(tǒng)的設(shè)計與實現(xiàn)[D];西安電子科技大學;2019年

7 潘江;基于地理信息的學術(shù)數(shù)據(jù)可視化系統(tǒng)[D];大連理工大學;2019年

8 高盼;基于Hadoop的電力大數(shù)據(jù)可視化研究與實現(xiàn)[D];重慶郵電大學;2018年

9 張琳;電力行業(yè)數(shù)據(jù)可視化系統(tǒng)研究與實現(xiàn)[D];電子科技大學;2019年

10 孫嘉陽;科技藝術(shù)創(chuàng)作理論下的數(shù)據(jù)可視化研究與實踐[D];華中師范大學;2019年

本文編號：2823101