葉 楓,戴陽(yáng)陽(yáng),楊志勇,張 鵬,王志堅(jiān)
水利數(shù)據(jù)的信息圖展現(xiàn)研究初探
葉 楓1,戴陽(yáng)陽(yáng)1,楊志勇1,張 鵬2,3,王志堅(jiān)1
(1. 河海大學(xué) 計(jì)算機(jī)與信息學(xué)院,江蘇 南京 211100;2. 南京市六合區(qū)水利局,江蘇 南京 211500;3. 江蘇省水利工程規(guī)劃辦公室,江蘇 南京 210029)
隨著網(wǎng)絡(luò)化的快速發(fā)展及智能移動(dòng)終端的普及,信息圖因具有直觀、安全等特點(diǎn),在數(shù)據(jù)可視化、信息傳播等方面起的作用愈加顯著。在概述信息圖的基礎(chǔ)上,介紹制作信息圖的工具,并提出用信息圖展示水利數(shù)據(jù)的具體方法和流程等;結(jié)合具體項(xiàng)目,實(shí)現(xiàn)水文日?qǐng)?bào)信息圖和匯總水利普查數(shù)據(jù)的魚(yú)骨圖。結(jié)果表明,相比于傳統(tǒng)的信息展示方式,信息圖更加直觀、圖文并茂,豐富水利信息化數(shù)據(jù)的展現(xiàn)和應(yīng)用方式,對(duì)于防汛防旱、生態(tài)保護(hù)等具有重要意義和應(yīng)用價(jià)值。
信息圖;數(shù)據(jù)可視化;數(shù)據(jù)展現(xiàn);水利數(shù)據(jù)
信息圖(Information Graphics)[1]是對(duì)信息資料、數(shù)據(jù)或知識(shí)的可視化表示,它能通過(guò)圖、表、地圖等形式,讓客觀數(shù)據(jù)“講故事”,實(shí)現(xiàn)對(duì)繁雜信息的提煉并快速、準(zhǔn)確地呈現(xiàn)和傳遞,符合云計(jì)算、大數(shù)據(jù)時(shí)代海量信息快速獲取、交互和共享的需求。例如,各類(lèi)商場(chǎng)的導(dǎo)視圖、建筑的規(guī)劃圖、氣象勘測(cè)圖及街道上的行止標(biāo)識(shí)等,均是超越不同語(yǔ)言和文化的界限傳達(dá)人們所需要的信息。隨著高速高帶寬網(wǎng)絡(luò)的快速發(fā)展及智能移動(dòng)終端的普及,信息圖在數(shù)據(jù)可視化、信息傳播等方面起的作用愈加顯著,并已廣泛滲透到人們生活、工作、學(xué)習(xí)、娛樂(lè)等的各個(gè)方面。
水利信息化領(lǐng)域?qū)儆跀?shù)據(jù)密集型的領(lǐng)域,長(zhǎng)期以來(lái)積累了豐富的數(shù)據(jù)資源,包括長(zhǎng)時(shí)間序列的水文、大數(shù)據(jù)規(guī)模的衛(wèi)星影像等數(shù)據(jù)。傳統(tǒng)的信息展示方式缺乏豐富的數(shù)據(jù)展現(xiàn)機(jī)制,圖形化較為單調(diào),而表格形式又很復(fù)雜,難以讓用戶(hù)快捷、直觀地獲取數(shù)據(jù)和信息。因此,若能將水利數(shù)據(jù)資源用信息圖的方式展現(xiàn),對(duì)于防汛防旱、生態(tài)保護(hù)、水土保持等具有重要意義和應(yīng)用價(jià)值。具體的應(yīng)用需求有很多,比如:將水利普查公報(bào)、每年的水資源公報(bào)以信息圖的形式表現(xiàn)會(huì)讓更多的受眾了解水利、水資源狀況;在防汛防旱中,將實(shí)時(shí)的狀況表現(xiàn)成信息圖形式,將更有利于做出決策。但是,在這方面的研究和應(yīng)用尚沒(méi)有太多成熟的案例。
針對(duì)上述問(wèn)題,在概述信息圖的基礎(chǔ)上,介紹制作信息圖的工具,并提出用信息圖展示水利數(shù)據(jù)的具體流程等;結(jié)合項(xiàng)目,設(shè)計(jì)并實(shí)現(xiàn)用于防汛防旱業(yè)務(wù)的水文日?qǐng)?bào)信息圖和用于展示水利普查匯總數(shù)據(jù)的魚(yú)骨圖。
信息設(shè)計(jì)最早起源于 18 世紀(jì)中期,當(dāng)時(shí)通過(guò)將信息圖表與地圖相結(jié)合的設(shè)計(jì),找到了霍亂疫情人的位置和源頭[2]。19 世紀(jì) 60 年代,信息圖先驅(qū)查爾斯 ? 米納德制作了關(guān)于拿破侖進(jìn)攻俄國(guó)的戰(zhàn)役信息圖,在有限的空間中表示了法國(guó)軍隊(duì)的數(shù)量、行動(dòng)等隨時(shí)間的變化狀況,最終說(shuō)明了整場(chǎng)戰(zhàn)爭(zhēng)失敗的因果關(guān)系[3]。另外的經(jīng)典信息圖案例是化學(xué)元素周期表和倫敦地鐵交通圖。在化學(xué)元素周期表中,不僅可以推斷出化學(xué)元素屬性的周期性變化,還可以根據(jù)已知元素的屬性及周期精確地預(yù)測(cè)未知元素;倫敦地鐵交通圖是 Harry Beck 采用 45° 和 90° 電路布局的風(fēng)格,以簡(jiǎn)潔明了的方式繪制的一幅信息圖[4]。在國(guó)內(nèi),2008 年汶川地震后,研究人員制作了一張關(guān)于地震情況的信息圖,圖中主要顯示經(jīng)歷了強(qiáng)烈的地震強(qiáng)度的大中城市中心位置及其具體城市,這為未來(lái)預(yù)測(cè)地震情況提供了借鑒。從上述例子不難看出,信息圖帶給人的深刻印象很持久和其宣傳效果非常顯著,能讓受眾快捷地獲取數(shù)據(jù)和信息。
對(duì)于信息圖的研究,也已有了一些成果。在參考文獻(xiàn) [3] 中,鄧偉等研究了地圖在信息圖表中的使用方式; Shen Huaping[4]研究了數(shù)據(jù)可視化的分類(lèi)、發(fā)展,并認(rèn)為信息圖是廣義的數(shù)據(jù)可視化的分類(lèi)之一;參考文獻(xiàn) [5] 分析了將傳統(tǒng)的主題地圖與信息圖的原則和方法相結(jié)合的概念和構(gòu)造機(jī)制;在參考文獻(xiàn) [6] 中,Liu Yuelin 等提出了幾種組合的信息圖設(shè)計(jì)原則。上述研究為研究信息圖的設(shè)計(jì)、發(fā)展和應(yīng)用提供了很好的基礎(chǔ)和思路。由于水利領(lǐng)域數(shù)據(jù)同樣具有實(shí)時(shí)更新、異構(gòu)的特性,非常適合使用信息圖展現(xiàn)。但已有的研究直接應(yīng)用到水利信息化方面尚不成熟,因此研究將信息圖與水利數(shù)據(jù)和業(yè)務(wù)相結(jié)合,使水利信息化數(shù)據(jù)以更加高效、簡(jiǎn)潔的方式呈現(xiàn),這是非常有意義和應(yīng)用價(jià)值的。
2.1 信息圖特點(diǎn)
信息圖通常具有以下特點(diǎn):
1)展示數(shù)據(jù)。數(shù)據(jù)、信息的展示是信息圖最常見(jiàn)的用途之一。常規(guī)的統(tǒng)計(jì)報(bào)告中往往堆砌著大量枯燥的表格和文字,而信息圖則能快速、簡(jiǎn)潔、直觀地展示報(bào)告中的信息要點(diǎn),讓相關(guān)人員及時(shí)地獲取信息或數(shù)據(jù)內(nèi)容,輔助其提高分析效率。
2)易于表達(dá)復(fù)雜的概念和數(shù)據(jù)內(nèi)容。信息圖能將復(fù)雜的數(shù)據(jù)內(nèi)容展現(xiàn)為易于理解的圖,這就容易表達(dá)復(fù)雜的概念和數(shù)據(jù)內(nèi)容,尤其適合做綜述式的介紹。
3)描述系統(tǒng)工作原理。信息圖常被用于解釋和描述復(fù)雜系統(tǒng)或項(xiàng)目背后的工作原理,例如:智能可穿戴設(shè)備的組成、一個(gè)網(wǎng)站的邏輯層次等。
4)適用于比較分析。信息圖能夠以可視化的方式非常直觀地平行展示數(shù)據(jù),以此比較雙方的異同,這種比較方式能夠傳遞很多語(yǔ)言無(wú)法表達(dá)的信息[7]。
5)數(shù)據(jù)安全。信息圖都是以圖表的形式展示,未涉及原始信息數(shù)據(jù),從而保證信息安全。
隨著互聯(lián)網(wǎng)的快速發(fā)展及智能移動(dòng)終端的日趨普及,信息圖因具有的上述特點(diǎn),在數(shù)據(jù)可視化、信息傳播等方面起的作用愈加顯著。諸多國(guó)內(nèi)外企業(yè)和單位已經(jīng)采用信息圖的方式進(jìn)行品牌的構(gòu)建、年度報(bào)告設(shè)計(jì)、向特定客戶(hù)群傳達(dá)信息及進(jìn)行教育,受眾面非常廣,影響力遠(yuǎn)超以往。
2.2 常用的信息圖實(shí)現(xiàn)工具
Adobe Photoshop(簡(jiǎn)稱(chēng) PS),是由 Adobe Systems 開(kāi)發(fā)的圖像處理軟件。PS 主要用于處理以像素所構(gòu)成的數(shù)字圖像。使用其眾多的編修與繪圖工具,可以有效地開(kāi)展多樣化的圖片編輯工作。
Adobe Illustrator 是一款矢量繪制圖形設(shè)計(jì)軟件,被廣泛應(yīng)用于印刷出版、海報(bào)書(shū)籍排版、專(zhuān)業(yè)插畫(huà)、多媒體圖像處理和互聯(lián)網(wǎng)頁(yè)面的制作等方面,也能為線稿提供較高的精度和控制,適合生產(chǎn)任何小型設(shè)計(jì)到大型的復(fù)雜項(xiàng)目。
Visual.ly[8]是一個(gè)在線制作信息圖的自動(dòng)化工具,網(wǎng)站中提供了大量由其他用戶(hù)制作的信息圖形和主題模板,方便用戶(hù)以此為基礎(chǔ)制作屬于自己的信息圖,并且該工具使用方式簡(jiǎn)單,易于上手。
Infogr.am[9]能夠創(chuàng)建免費(fèi)的交互式圖表和信息圖,該工具是一款面向非設(shè)計(jì)師的信息圖設(shè)計(jì)工具。根據(jù)用戶(hù)上傳到網(wǎng)站上的數(shù)據(jù)解讀成圖表模式,且允許用戶(hù)自定義圖形,以及提供更多智能化界面展示信息。
還有很多的工具適用于不同場(chǎng)景的信息圖制作,受限于篇幅,不一一詳細(xì)介紹。表 1 對(duì)信息圖常用工具在應(yīng)用范圍、學(xué)習(xí)難度、平臺(tái)性、交互性等方面做進(jìn)一步比較。不難看出,不同的工具適用于不同的場(chǎng)景范圍,各具特點(diǎn),有些工具的學(xué)習(xí)和應(yīng)用比較復(fù)雜,有些則不適用于網(wǎng)絡(luò)化環(huán)境等。
2.3 用信息圖展示水利數(shù)據(jù)流程
制作信息圖的流程是一個(gè)從信息(多為數(shù)據(jù))到圖像的過(guò)程。這個(gè)過(guò)程不僅需要統(tǒng)計(jì)基礎(chǔ),也包括對(duì)信息圖的數(shù)據(jù)、素材管理,選擇合適的工具設(shè)計(jì)和排版,再到最終發(fā)布。水利信息化中的數(shù)據(jù)和業(yè)務(wù)類(lèi)型具有多樣化的特點(diǎn),所以有必要討論信息圖的實(shí)現(xiàn)流程。
表 1 信息圖常用工具對(duì)比分析
因此,所提出的用于生成信息圖以展示水利數(shù)據(jù)的流程如下:
1)由水利業(yè)務(wù)的用戶(hù)向數(shù)據(jù)分析人員描述需求并提供相應(yīng)的數(shù)據(jù)。
2)根據(jù)用戶(hù)需求和數(shù)據(jù),水利業(yè)務(wù)數(shù)據(jù)分析人員提取相應(yīng)的主題。例如:防汛防旱信息的展示或者水土保持的宣傳等。不同的主題,將決定后續(xù)的數(shù)據(jù)處理和信息圖的設(shè)計(jì)方式。
3)圍繞主題,由水利業(yè)務(wù)數(shù)據(jù)分析人員對(duì)不同的數(shù)據(jù)進(jìn)行處理。對(duì)水文數(shù)據(jù),水利業(yè)務(wù)數(shù)據(jù)分析人員可使用 Excel,Matlab 或者 R 語(yǔ)言等工具對(duì)數(shù)據(jù)進(jìn)行整理、分類(lèi)、計(jì)算和匯總,也可利用 Tableau Public 等工具對(duì)數(shù)據(jù)進(jìn)行深層次的挖掘,分析數(shù)據(jù)之間的關(guān)聯(lián)關(guān)系;然后,將處理過(guò)的數(shù)據(jù)以 XML 或JSON 的格式進(jìn)行存儲(chǔ)。對(duì)于圖像類(lèi)型數(shù)據(jù),需要定義圖片的元數(shù)據(jù)信息、存儲(chǔ)機(jī)制等。在該階段中,水利業(yè)務(wù)數(shù)據(jù)分析人員要為后續(xù)步驟提供用于實(shí)現(xiàn)信息圖的數(shù)據(jù)素材。
4)根據(jù)水利業(yè)務(wù)數(shù)據(jù)分析人員完成的數(shù)據(jù)素材,信息圖設(shè)計(jì)人員選擇相應(yīng)的工具。諸如 Google Chart Tools,Hohli Charts 等,設(shè)計(jì)合適的信息圖表現(xiàn)形式。根據(jù)設(shè)計(jì)的模型,使用 Easel.ly,Visual.ly等相關(guān)工具中實(shí)現(xiàn)信息圖的編輯與整合,最后利用PS,Illustrator 等美工工具實(shí)現(xiàn)信息圖的完善。
5)信息圖設(shè)計(jì)人員將制作好的信息圖反饋給水利業(yè)務(wù)數(shù)據(jù)分析人員,由其核對(duì)信息圖是否符合用戶(hù)需求、有無(wú)缺漏、錯(cuò)誤描述、數(shù)據(jù)不符等。
6)將信息圖提交給用戶(hù)使用或發(fā)布。
該設(shè)計(jì)過(guò)程用 UML 時(shí)序圖如圖 1 所示。
3.1 六合區(qū)水文日?qǐng)?bào)信息圖
圖 1 信息圖制作流程的時(shí)序圖
作為長(zhǎng)江“黃金水道”段的重要支流,滁河流經(jīng)南京六合區(qū),沿河兩岸工農(nóng)業(yè)蓬勃發(fā)展,它既是六朝古都北大門(mén)的名片,也是城市南京綜合發(fā)展的保障。為積極開(kāi)展防汛防旱工作,六合區(qū)水利局防辦期望以信息圖的形式展現(xiàn)每日的水文日?qǐng)?bào)。所使用的數(shù)據(jù)包括通過(guò)第三方 Web 服務(wù)獲取的衛(wèi)星云圖、當(dāng)日天氣狀況、通過(guò)傳感器獲取的水文和雨量實(shí)時(shí)及數(shù)據(jù)庫(kù)中積累的長(zhǎng)期歷史等數(shù)據(jù)。對(duì)于不同數(shù)據(jù),需要進(jìn)行不同的處理,實(shí)現(xiàn)成用于制作信息圖的素材。例如,衛(wèi)星云圖數(shù)據(jù)的圖片素材,就是先使用 Java API 中的數(shù)據(jù)流機(jī)制轉(zhuǎn)換成二進(jìn)制流,然后命名為圖片格式的文件;對(duì)于歷史水文數(shù)據(jù),用 eCharts,Easel.ly 等開(kāi)發(fā)工具實(shí)現(xiàn)成水利用戶(hù)慣用的數(shù)據(jù)展示方式,并通過(guò)程序設(shè)置定時(shí)器,定時(shí)抓取并保持成素材圖片。
接下來(lái),設(shè)計(jì)水文日?qǐng)?bào)的模板。模板的設(shè)計(jì)主要使用排版和美工工具,例如 PS 和 Adobe Illustrator。根據(jù)素材圖片的格式、大小,設(shè)計(jì)出該水文日?qǐng)?bào)的信息圖模板。在準(zhǔn)備好圖片素材、生成了日?qǐng)?bào)模板的基礎(chǔ)上,只要很少的工作量,一個(gè)水文日?qǐng)?bào)的信息圖就可以生成了。六合測(cè)站點(diǎn) 2014 年12 月 24 日的水位日?qǐng)?bào)信息圖如圖 2 所示。該信息圖不僅展現(xiàn)了當(dāng)日水位與歷史同期水位信息,還包括當(dāng)日天氣和定時(shí)定點(diǎn)生成的衛(wèi)星云圖信息,方便用戶(hù)及時(shí)掌握多方位的水文信息并有利于公告或者會(huì)商,對(duì)防汛防旱工作的及時(shí)開(kāi)展著很大的幫助。
3.2 全國(guó)匯總水利普查數(shù)據(jù)信息圖
第一次全國(guó)水利普查形成我國(guó)迄今最為全面細(xì)致、完整系統(tǒng)的涉水基礎(chǔ)數(shù)據(jù)資源和規(guī)范權(quán)威的水利普查成果。若要有效地、多角度地展示豐富的普查成果,信息圖便凸顯出其獨(dú)特的優(yōu)勢(shì),它比傳統(tǒng)的表格和簡(jiǎn)單的餅圖、直方圖等,更能直觀形象地描述數(shù)據(jù)的匯總信息,有利于相關(guān)人員利用成果資料開(kāi)展進(jìn)一步的工作。
圖 2 設(shè)計(jì)的六合測(cè)站點(diǎn) 2014 年 12 月 24 日的水位日?qǐng)?bào)
以河流為紐帶,查閱沿河的水利對(duì)象的狀況和相互關(guān)系,是非常重要的一種信息匯總方式。魚(yú)骨圖適用于表示各個(gè)重要要素及其關(guān)系,并能進(jìn)一步分析存在的問(wèn)題。因此,考慮用魚(yú)骨圖的形式表示相關(guān)普查數(shù)據(jù)。首先,根據(jù)水利普查[11]收集到的關(guān)于長(zhǎng)江在全圖行政區(qū)劃下的防洪關(guān)聯(lián)指標(biāo)數(shù)據(jù),匯總河流、閘(泵)站、水庫(kù)等管理對(duì)象的信息,并用 JSON 數(shù)據(jù)格式保存數(shù)據(jù)。然后,使用排版和美工工具,設(shè)計(jì)該信息圖的版面內(nèi)容。要在魚(yú)骨圖中展現(xiàn)的內(nèi)容分為線條與節(jié)點(diǎn),線條表示河流信息內(nèi)容,例如:當(dāng)前河流治理保護(hù)、防洪任務(wù)和堤防等長(zhǎng)度綜合指標(biāo)情況;節(jié)點(diǎn)展現(xiàn)的為當(dāng)前河流上所擁有的防洪工程指標(biāo)的統(tǒng)計(jì)值,有泵站、水閘、水庫(kù)及主要防洪問(wèn)題等。
沿河相關(guān)的水利對(duì)象數(shù)據(jù)如圖 3 所示,數(shù)據(jù)通過(guò)魚(yú)骨圖的形式呈現(xiàn)出來(lái),便于用戶(hù)直觀地從不同角度查看分析對(duì)象數(shù)據(jù)。
圖 3 魚(yú)骨圖用于展示水利對(duì)象的關(guān)聯(lián)性和相關(guān)數(shù)據(jù)
信息圖已成為互聯(lián)網(wǎng)時(shí)代信息有效傳達(dá)的強(qiáng)有力工具。在水利信息化領(lǐng)域,使用信息圖展示水利數(shù)據(jù)資源的研究還處于探索階段。本研究用信息圖展示水利數(shù)據(jù)的具體方法和流程等,并實(shí)現(xiàn)了水文日?qǐng)?bào)信息圖和匯總水利普查數(shù)據(jù)的魚(yú)骨圖的案例,目的是起到拋磚引玉的作用。
水利信息化中的數(shù)據(jù)資源具有領(lǐng)域特色,進(jìn)一步的研究方向是根據(jù)所應(yīng)用的數(shù)據(jù)類(lèi)型,定制開(kāi)發(fā)出信息圖的動(dòng)態(tài)組件。
[1] Wikipedia. Infographic[EB/OL]. [2014-10-14]. http://en. wikipedia.org/wiki/Infographic.
[2] 陳雅群. 信息圖表設(shè)計(jì)的視覺(jué)語(yǔ)言研究[J]. 群文天地,2012 (6): 81.
[3] 鄧偉, 盧一波. 地圖,可視化報(bào)道的舊瓶新酒——信息圖表中地圖使用的三個(gè)層次[J]. 新聞界,2013 (10): 41-45.
[4] Shen Huaping. Exploration on the Data Visualization based on the Case of Infographics[J]. Advanced Materials Research, 2014, 909: 375-378.
[5] He Manli, Xi Tang, Huang YuMing. To Visualize Spatial Data Using Thematic Maps Combined with Infographics [C]//Processing of19th International Conference on Geoinformatics. Shanghai: IEEE Computer Society, 2011: 1-5.
[6] Liu Yuelin,Hao Lili. Information Graphics as A Visual Language [C]// Processing of 11th International Conference on Computer-Aided Industrial Design & Conceptual Design (Volume:1). Yiwu: IEEE Computer Society, 2010: 757-761.
[7] IT 經(jīng)理網(wǎng). 一圖抵萬(wàn)言:信息圖的五大用途[EB/OL].[2014-11-19]. http://www.ctocio.com/ccnews/13704.html#respond.
[8] Verticalresponse.DIY:5 Free Tools for Creating Killer Infographics[EB/OL]. [2014-11-19]. http://www.verticalresponse.com/blog/diy-5-tools-for-creating-killer-infographics/.
[9] 云圖網(wǎng). 9 個(gè)功能強(qiáng)大的信息圖制作網(wǎng)站[EB/OL]. [2014-04-13]. http://yuntuwang.net/xxt/2014-04-13/16.html.
[10] Julie Steele, Noah lliinsky. 數(shù)據(jù)可視化之美[M]. 祝洪凱,李妹芳,譯. 北京:機(jī)械工業(yè)出版社,2011: 39-60.
[11] 中華人民共和國(guó)水利部,國(guó)家統(tǒng)計(jì)局. 第一次全國(guó)水利普查公報(bào)[R]. 北京:中國(guó)水利水電出版社,2013.
Preliminary Study for Data Infographics Presentation of Water Domain Using Information Graphics
YE Feng1, DAI Yangyang1, YANG Zhiyong1, ZHANG Peng2,3, WANG Zhijian1
(1. College of Computer and Information, Hohai University, Nanjing 211100, China;2. Water Conservancy Bureau of Liuhe District, Nanjing 211500, China;3. Hydraulic Engineering Planning Office of Jiangsu, Nanjing 210029, China)
With the rapid development of networks and the popularity of smart mobile terminals, security and so on, infographics play an increasingly significant role in data presentation and information dissemination because of its visualization. Based on the overview of infographics, after introducing the tools for implementing infographics, the paper presents the method and processes of developing infographics for water conservancy business data. Combining with the specific projects, the infographic for daily hydrological information and the fishbone diagram for summarizing the national water census data are implemented for data presentation. The results show that compared with the traditional approaches of the data presentation, the infographics are more visual and illustrated, which enrich the way of presentation and application of water conservancy data. It is meaningful and valuable for flood control and drought, and ecological protection.
infographics; datavisualization; data presentation; water conservancy data
TV39
A
1674-9405(2015)03-0005-05
2015-02-27
江蘇水利科技項(xiàng)目“‘智慧河流’研究及其在六合滁河管理中的應(yīng)用”(2013025);國(guó)家科技支撐計(jì)劃項(xiàng)目數(shù)字流域關(guān)鍵技術(shù)(2013BAB05B00);基于物聯(lián)網(wǎng)的流域信息獲取技術(shù)研究(2013BAB05B01)。
葉 楓(1980-),男,山東濟(jì)南人,講師,從事云計(jì)算、水利領(lǐng)域大數(shù)據(jù)研究。